DEV Community

Cover image for Mantine – 100+ React hooks and components with native dark theme support
Vitaly Rtishchev
Vitaly Rtishchev

Posted on

Mantine – 100+ React hooks and components with native dark theme support

Hi all, I'm very excited to share my latest open source project Mantine. Mantine is a MIT licensed open source React components and hooks library with native dark theme support and focus on accessibility, usability and developer experience.

Examples

Explore all examples on Mantine home page

Spendings table:

Cards grid:

Key Features

  • Customization – colors, fonts, shadows and many other parts are customizable to fit your design needs
  • Flexibility – configure components appearance and behavior with vast amount of settings or overwrite any part of component styles
  • Dark theme – mantine supports dark theme by default in all components
  • Accessibility and usability – all components follow accessibility best practices and feature full keyboard support
  • TypeScript – all @mantine/ scoped packages are built with TypeScript and support it by default
  • Ready for production – mantine is well tested and works in all modern browsers
  • Developer experience – mantine comes with more than 50 components and 15 hooks to cover you in most cases
  • No annoying focus ring – with new :focus-visible pseudo-class focus ring appears only when user navigates with keyboard
  • React JSS – take advantage of all react-jss features: automatic critical css extraction during ssr, lazy evaluation, dynamic theming and others
  • React and Preact – mantine works flawlessly with preact

Links

Thanks for stopping by and let me know what you think, I'm always open to feedback and critique!

Top comments (1)

Collapse
 
huzaifams profile image
HuzaifaMS

Cool work. Can't wait to try it in action with tailwind twinjs