设计师和前端开发人员复刻网站视觉风格时,手动拾色效率低下,逐像素记录十六进制代码极易出错。Site Palette 浏览器扩展通过算法化分析 CSS 与可见样式,从任意网页一键生成调色板,目前服务超过 80,000 名日常用户。
Site Palette 浏览器扩展的多算法提取原理
Site Palette 兼容 Chrome、Edge、Brave、Opera、Firefox 五款主流浏览器。区别于传统单点吸管,该扩展采用 Color Cube、Median Cut、Material Design、视口面积排名四种算法交叉提取颜色,输出比单点拾色更连贯的调色板。整体流程为:扫描网页 DOM 中的色值与可见样式,按出现频次和显示面积排序,最终输出结构化调色板,每条颜色记录包含十六进制、RGB 与占比数据。
更关键的是它对设计软件的端到端输出能力。调色板能直接导出为 Figma 局部变量(Local Variables)、Sketch 模板、Adobe Swatch (.ase) 与 SVG 四种格式。相比之下,同类工具 ColorZilla 停留在十六进制复制层面,Coolors 与 Adobe Color 走的是 AI 随机生成路径,二者都不具备“从真实网站提取并直出设计软件”的链路。这种“提取即导出”的集成方式,使该扩展在配色工具生态中具有独特定位。
| 维度 | Site Palette | ColorZilla | Coolors / Adobe Color |
|---|---|---|---|
| 提取方式 | 多算法分析网页 CSS | 像素级单点拾取 | AI 生成或自定义 |
| 设计软件集成 | Figma 变量、Sketch、.ase、SVG | 仅十六进制/RGB | 多为十六进制/RGB |
| 价格 | 月 $2.5 / 年 $30 / 终身 $79 | 免费 | 部分免费 |
Site Palette 适合谁
该扩展适合以下三类人群:UI/UX 设计师做竞品视觉审计、品牌重定义前的旧色板留档、设计系统初始化时,可直接把网页调色板导入 Figma 或 Sketch。前端开发参考目标网站配色时,批量获取十六进制代码避免逐个吸管拾取。内容创作与营销人员制作配图或情绪板时,能快速还原某个站点的色彩氛围。
Site Palette 的付费墙与不适用场景
Site Palette 仅提供 24 小时或 1 天的免费试用,到期后必须订阅:月付 $2.5、年付 $30、终身 $79。预算敏感或只需偶尔拾色的用户,浏览器自带吸管或免费 ColorZilla 已足够。如果你的需求只是查看某个按钮的十六进制值,而不是分析整站配色,订阅费用的边际收益较低。










