CSS主题变量生成器

反馈
二维码
手机扫码查看
收藏
Parameter

编辑器加载中...

编辑器加载中...

CSS主题变量生成器介绍

CSS主题变量生成器用于快速创建项目的主题色与基础变量,适合设计系统与统一配色规范。工具支持设置主色、副色、背景色、文字色、圆角与阴影,并生成可直接使用的CSS变量与示例结构。

主要参数说明

  • Primary / Secondary:设置主色与副色。
  • Background / Text:设置背景与文字颜色。
  • Radius:设置全局圆角。
  • Shadow:设置全局阴影。

使用教程

  1. 配置色彩:设置主色、副色与背景色。
  2. 设置基础变量:配置圆角与阴影变量。
  3. 预览效果:在 Preview 标签页查看主题效果。
  4. 复制代码:在 CSS 与 HTML 标签页复制生成代码。

应用场景

  • 设计系统:用于统一主题变量。
  • 组件库:用于组件基础配色规范。
  • 快速换肤:用于主题切换与样式复用。