Mantine UIFAQColors generator

Shadows

Mantine provides 5 different shadows by default:

  • xs
  • sm
  • md
  • lg
  • xl

You can override them in your theme:

const theme = createTheme({
  shadows: {
    xs: '0px 1px 2px rgba(0, 0, 0, 0.05)',
    sm: '0px 1px 2px rgba(0, 0, 0, 0.05)',
  },
});

Default shadows

Shadow xs

--mantine-shadow-xs

Shadow sm

--mantine-shadow-sm

Shadow md

--mantine-shadow-md

Shadow lg

--mantine-shadow-lg

Shadow xl

--mantine-shadow-xl

Getting started