阴影

语义令牌

Chakra UI 开箱即支持这些语义令牌。

以下是如何添加新阴影的示例。

export const system = createSystem(defaultConfig, {
    theme: {
        semanticTokens: {
            shadows: {
                custom: {
                    value: {
                        _light: "0 32px 56px 0 rgba(0, 0, 0, 0.25)",
                        _dark: "0 32px 56px 0 rgba(0, 0, 0, 0.25)",
                    },
                },
            },
        },
    },
});