Welcome to Mantine!
Framework guides
Get started without framework
Choose packages that you will use in your application:
Package | Description | |
---|---|---|
@mantine/hooks | Hooks for state and UI management | |
@mantine/core | Core components library: inputs, buttons, overlays, etc. | |
@mantine/form | Form management library | |
@mantine/dates | Date inputs, calendars | |
@mantine/notifications | Notifications system | |
@mantine/prism | Code highlight with your theme colors and styles | |
@mantine/tiptap | Rich text editor based on Tiptap | |
@mantine/dropzone | Capture files with drag and drop | |
@mantine/carousel | Embla based carousel component | |
@mantine/spotlight | Overlay command center | |
@mantine/modals | Centralized modals manager | |
@mantine/nprogress | Navigation progress |
Install dependencies:
Wrap your application root component with MantineProvider:
All set! You can now import and use Mantine components anywhere in your application:
Start learning
Learn the basics
Read a 5 minute tutorial to get an overview of all core features, please start your journey with Mantine here
Learn about theming
Learn how to change colors, fonts, shadows, spacing and other theme values with MantineProvider
Explore source code
Mantine packages and documentation website is open source, if you like Mantine please give us a star
Explore Mantine UI
Mantine UI is a set of 120+ responsive components. All components support dark/light theme. It is free for everyone.