Radix 主页
由 WorkOS 制作
Radix 主页
由 WorkOS 制作
主题主题基本元素基本元素图标图标颜色颜色
文档游乐场博客
指南

阴影

了解主题中使用的阴影样式。

组件中使用的阴影来自一个 6 级色阶。请参考 源代码 获取用于实现这些阴影的实际值。

1
2
3
4
5
6

阴影标记

可以使用 CSS 变量访问阴影标记。您可以使用这些标记来样式化您的自定义组件，确保它们与主题的其他部分保持一致。

/* 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);
上一个圆角
下一个鼠标指针
在 GitHub 上编辑此页面。