Getting Started - Mantine

import { Layout } from '@/layout'; import { MDX_DATA } from '@/mdx';

export default Layout(MDX_DATA.GettingStartedCharts);

Installation

After installation, import package styles at the root of your application:

tsx

import '@mantine/core/styles.css';
// ‼️ import charts styles after core package styles
import '@mantine/charts/styles.css';

Do not forget to import styles

Followed the installation instructions above but something is not working (misplaced tooltips or no colors)? You've fallen into the trap of not importing chart styles! To fix the issue, import chart styles at the root of your application:

tsx

import '@mantine/charts/styles.css';

Based on recharts

Most of the components in the @mantine/charts package are based on the recharts library. If you need advanced features that are not covered in the @mantine/charts documentation, refer to the recharts documentation for more information.