Shadow
The intensity of color shadows in an application component elements can be managed dynamically by the theme shadow utility.
A numeric factor value can be setup for blur and spread shadow values. Then a multiplier for each value can be supplied to get the specific shadow intensity.
tsx
const theme = createTheme({shadow: {blur: 2,spread: 3}});theme.shadow.blur(1); // 2theme.shadow.blur(2); // 4theme.shadow.blur(3); // 6theme.shadow.blur(0); // 0theme.shadow.spread(1); // 3theme.shadow.spread(2); // 6theme.shadow.spread(3); // 9theme.shadow.spread(0); // 0
By default, both factor values are 1
.