Tema Mantine
// theme.ts — Mantine
import { createTheme } from '@mantine/core';
export const theme = createTheme({
fontFamily: "'Instrument Sans', sans-serif",
fontFamilyMonospace: "'JetBrains Mono', monospace",
headings: {
fontFamily: "'Space Grotesk', sans-serif",
fontWeight: '600',
},
primaryColor: 'violet',
primaryShade: { dark: 5 },
colors: {
violet: ['#F1EFFF','#DEDAFF','#C4BCFF',
'#A79DFF','#8D80FF','#7B6CFF',
'#6A5AE6','#5748C2','#463A9E','#362D7A'],
dark: ['#EDEFF5','#A6ACBB','#8A8FA3',
'#5A6070','#23262F','#1C1F27',
'#15171E','#101218','#0D0E12','#0A0B0E'],
},
defaultRadius: 'md',
radius: { xs:'6px', sm:'7px', md:'8px',
lg:'12px', xl:'14px' },
spacing: { xs:'6px', sm:'10px', md:'14px',
lg:'20px', xl:'28px' },
components: {
Card: { defaultProps: { radius:'lg',
withBorder:true } },
Button: { defaultProps: { radius:'md' } },
},
});
// <MantineProvider theme={theme}
// defaultColorScheme="dark">