@mantine/core
Mantine is a fully featured React component library providing 100+ customizable components, 50+ hooks, and a rich set of utilities for building modern web appli…
Installation
npm install @mantine/core @mantine/hooks
yarn add @mantine/core @mantine/hooks
pnpm add @mantine/core @mantine/hooks
Import
import { Button, TextInput } from '@mantine/core';Quick Example
import { Button, Card, Text, Group, TextInput } from '@mantine/core';
function App() {
return (
<Card shadow="sm" padding="lg" radius="md" withBorder>
<Text fw={500} size="lg" mb="md">Login</Text>
<TextInput label="Email" placeholder="[email protected]" mb="sm" />
<Group justify="flex-end">
<Button variant="light">Cancel</Button>
<Button>Submit</Button>
</Group>
</Card>
);
}About @mantine/core
Mantine is a fully featured React component library providing 100+ customizable components, 50+ hooks, and a rich set of utilities for building modern web applications. Mantine stands out for its comprehensive scope — beyond standard UI components, it includes a rich text editor, date pickers, notifications system, spotlight (command palette), carousel, dropzone, and code highlighting. All components support dark mode, responsive styles through Mantine's style system, and deep customization through CSS modules, style props, or the createStyles API. Mantine's hook library (@mantine/hooks) provides 50+ hooks for common UI patterns including useDisclosure, useClickOutside, useHotkeys, useIntersection, useScrollIntoView, useClipboard, and useForm for form validation. The form library (@mantine/form) handles validation, nested objects, list fields, and form state management. Mantine supports server-side rendering with Next.js, Remix, and Gatsby. Components use CSS Modules for styling in v7+, eliminating runtime CSS-in-JS overhead. The design system supports polymorphic components (rendering any element type), composable styles, and theme extension points. Mantine is particularly well-suited for data-rich applications, admin panels, and projects that benefit from a comprehensive, well-integrated component ecosystem.
Quick Facts
| Package | @mantine/core |
| Category | UI Component |
| Weekly Downloads | 500K+ |
| License | MIT |
| Install | npm install @mantine/core @mantine/hooks |
Related Packages
Material UI (MUI) is the most popular React UI component library, implementing Google's Material Des…
Chakra UI is an accessible, modular React component library that provides a set of composable buildi…
Ant Design is an enterprise-class UI design language and React component library created by Ant Grou…
React is the most popular JavaScript library for building user interfaces, developed and maintained …
Radix UI is a collection of unstyled, accessible React component primitives for building high-qualit…
Browse npm Packages by Category
Explore our reference of 200 popular npm packages with install commands, examples, and quick-start guides.