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.

E…


This content originally appeared on DEV Community and was authored by Vitaly Rtishchev

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!


This content originally appeared on DEV Community and was authored by Vitaly Rtishchev


Print Share Comment Cite Upload Translate Updates
APA

Vitaly Rtishchev | Sciencx (2021-07-06T14:05:54+00:00) Mantine – 100+ React hooks and components with native dark theme support. Retrieved from https://www.scien.cx/2021/07/06/mantine-100-react-hooks-and-components-with-native-dark-theme-support/

MLA
" » Mantine – 100+ React hooks and components with native dark theme support." Vitaly Rtishchev | Sciencx - Tuesday July 6, 2021, https://www.scien.cx/2021/07/06/mantine-100-react-hooks-and-components-with-native-dark-theme-support/
HARVARD
Vitaly Rtishchev | Sciencx Tuesday July 6, 2021 » Mantine – 100+ React hooks and components with native dark theme support., viewed ,<https://www.scien.cx/2021/07/06/mantine-100-react-hooks-and-components-with-native-dark-theme-support/>
VANCOUVER
Vitaly Rtishchev | Sciencx - » Mantine – 100+ React hooks and components with native dark theme support. [Internet]. [Accessed ]. Available from: https://www.scien.cx/2021/07/06/mantine-100-react-hooks-and-components-with-native-dark-theme-support/
CHICAGO
" » Mantine – 100+ React hooks and components with native dark theme support." Vitaly Rtishchev | Sciencx - Accessed . https://www.scien.cx/2021/07/06/mantine-100-react-hooks-and-components-with-native-dark-theme-support/
IEEE
" » Mantine – 100+ React hooks and components with native dark theme support." Vitaly Rtishchev | Sciencx [Online]. Available: https://www.scien.cx/2021/07/06/mantine-100-react-hooks-and-components-with-native-dark-theme-support/. [Accessed: ]
rf:citation
» Mantine – 100+ React hooks and components with native dark theme support | Vitaly Rtishchev | Sciencx | https://www.scien.cx/2021/07/06/mantine-100-react-hooks-and-components-with-native-dark-theme-support/ |

Please log in to upload a file.




There are no updates yet.
Click the Upload button above to add an update.

You must be logged in to translate posts. Please log in or register.