Surfaces

在 ChatGPT 中打开

有三个级别的表面用于组织UI层次，通常结合阴影使用。所有调色板颜色经过测试，以提供与这些表面之间的足够对比度。

示例

.element {
  background: var(--dwc-surface-2);
}

变量

变量	用法	示例
--dwc-surface-1	最暗的表面。用于主体背景。
--dwc-surface-2	用于组件（例如卡片）。
--dwc-surface-3	最亮和最高的表面。用于菜单、弹出框、对话框等...