跳到主要内容
项目详情

Site Palette 是一款网站配色提取工具,主要以浏览器扩展的形式工作,也提供 Figma 插件。它可以读取任意网站页面中使用的颜色,在几秒内生成配色方案和对应的十六进制色值,设计师和前端开发者无需检查 CSS 就能获取网页的主色与完整色彩组合。与仅用于查看单个颜色的工具不同,Site Palette 还支持查看历史调色板、通过永久链接分享配色,并将结果下载为 SVG、Sketch 和 Adobe Swatch 文件;颜色提取过程默认在本地完成,除非用户主动分享,否则数据不会离开本地环境。

核心功能

从网站提取颜色

安装扩展后打开任意网页,在扩展中点击创建调色板,Site Palette 会读取页面并提取网页使用的颜色。生成结果包括占主导地位的颜色、完整配色方案以及每种颜色的十六进制代码,不需要通过检查 CSS 来寻找颜色。

多种配色算法

Site Palette 提供 Median cut、Material Design 和 Color cube 三种生成方式。Median cut 会在三维模型中聚类相近颜色,按体积排序后返回各区块的基础色;Material Design 基于 Android SDK 中的 Palette 类;Color cube 会构建三维直方图网格,并搜索命中数的局部最大值。

调色板历史记录

每次生成调色板后,用户可以在历史记录中查看已有的调色板。官网的使用流程包括安装扩展、点击浏览器中的扩展图标、生成第一个调色板,以及查看全部历史调色板,便于回看此前从网站提取的颜色方案。

创建、混合与分享配色

除了从网站读取颜色,Site Palette 还支持创建和混合配色方案。生成的调色板可以通过永久链接分享,适合将配色结果交给其他人查看或继续使用。

导出设计文件

颜色方案可以下载为 SVG、Sketch 和 Adobe Swatch 文件,因此提取出的网页配色能够直接进入相应的设计工作流。官网同时提供 Figma 插件,可在 Figma 工作区中快速访问 Site Palette,并从设计文件附近打开插件页面完成安装。

使用方式

Site Palette 支持 Chrome、Firefox 和 Safari 浏览器扩展。使用时先安装扩展,打开目标网站,再点击扩展中的创建调色板即可生成结果;官网没有说明必须使用自备模型 Key,也没有提供 API 或命令行方式。除浏览器扩展外,还可以从 Figma Community 安装 Site Palette 插件,在 Figma 工作区中使用接近浏览器扩展的工作流。生成的配色可通过永久链接分享,也可导出为 SVG、Sketch 和 Adobe Swatch 文件。颜色提取默认在本地完成,除非主动分享,否则数据在本地处理。

适用人群与场景

设计师可以从参考网站提取主色和完整配色方案,再通过 Figma 插件或 Sketch、Adobe Swatch 等格式继续使用。前端开发者可以快速获取目标网站的十六进制色值,用于分析网页配色。需要整理灵感的人可以保存调色板历史,并用永久链接分享结果;需要把网页配色带入设计文件的人,则可以使用 Figma 插件或下载后的设计资源文件。

定价

新用户可获得免费的 24 小时试用。试用后,订阅方案起价为每月 2.50 美元,按年计费;也可以一次性支付 99 美元购买终身使用权。官网将这些方案用于解锁完整的设计师配色提取功能。

网页配色提取从任意网站页面读取颜色,生成包含主色、完整配色方案和十六进制代码的调色板。
三种颜色分析算法提供 Median cut、Material Design 和 Color cube 三种配色生成方式。
历史调色板生成调色板后可在历史记录中查看此前保存的配色结果。
分享与下载支持通过永久链接分享调色板,并下载为 SVG、Sketch 和 Adobe Swatch 文件。
Figma 插件可从 Figma Community 安装插件,在 Figma 工作区中直接使用 Site Palette。

用户评论 (0)

还没有用户评论

成为第一个分享使用体验的人

查看更多

Site Palette 截图

官网首页截图

写评论

分享你的使用体验,至少 10 个字。评论可以发多条,打分在右侧卡片单独进行。

还需 10 个字 · 0 / 500