从网页颜色到可用代码

选择适合你的颜色工作流

从网页取色和品牌调色板研究开始,再将选定颜色导出为 CSS Variables、Tailwind Config 或 W3C Design Tokens。

添加到 Chrome — 免费

五个明确入口

先选择任务,再选择输出。

01Free

Chrome 网页取色器

从网页拾取颜色,复制 HEX、RGB 或 HSL,并在历史记录中保留最近 20 个颜色。

从网页取色
02Free + Pro

网站调色板提取器

从参考网站采集品牌色,为竞品研究、品牌分析或改版整理调色板。

提取网站调色板
03Free

CSS Variables 生成器

将选定的网站颜色转换成样式表可以继续使用的 CSS 自定义属性。

导出 CSS Variables
04Pro

Tailwind-ready 调色板

将采集的网站颜色导出为 Tailwind Config 起点,同时保留对名称和色阶的控制。

创建 Tailwind 调色板
05Pro

颜色设计令牌

在项目中整理界面颜色,并导出适合设计系统继续处理的 W3C Design Tokens。

导出颜色令牌

完整工作流

拾取 → 整理 → 导出

免费版覆盖网页取色、历史记录、一个项目和 CSS Variables。需要页面颜色提取、多个项目、Tailwind 或 W3C 导出时,再升级 Pro。