Shadow tokens can be accessed using CSS variables. You can use these tokens to style your custom components, ensuring they are consistent with the rest of your theme.
Copy
/* Inset shadow */var(--shadow-1);/* Shadows for variant="classic" panels, like Card */var(--shadow-2);var(--shadow-3);/* Shadows for smaller overlay panels, like Hover Card and Popover */var(--shadow-4);var(--shadow-5);/* Shadows for larger overlay panels, like Dialog */var(--shadow-6);