调色板提取器指南

从 JPG、PNG、WebP、AVIF、GIF、BMP 或 TIFF 图像中提取主色调色板。获取每种颜色的 HEX 和 RGB 代码。所有提取过程均在您的浏览器中本地运行，无需上传至任何服务器。

您需要准备什么

浏览器 — 支持 OffscreenCanvas 的 Chrome、Firefox、Safari 或 Edge 格式 — JPG、JPEG、PNG、WEBP、AVIF、GIF、BMP 或 TIFF 限制 — 每个文件 20 MB（超过 20 MB 的文件将被拒绝） 账户 — 无需注册 互联网 — 页面加载后无需联网

提取您的调色板

在浏览器中打开调色板生成器。将图像文件从文件资源管理器拖放到上传区域。或者，点击上传区域从您的设备中选择文件。上传前请确认文件大小在 20 MB 限制内——超过此阈值的文件将被拒绝。选择要提取的颜色数量：5、8、10 或 12。颜色越少，生成的调色板越简洁、越实用。颜色越多，捕捉到的细微差别就越多，但可能会包含视觉上不明显的细微差异。点击提取按钮。量化算法会在您的浏览器中处理图像的像素数据。它使用 k-means 聚类算法根据颜色相似度对像素进行聚类，并计算每个聚类的平均颜色。没有任何数据通过网络传输。查看提取出的调色板。每种颜色都显示为一个视觉色块，并附带其 HEX 代码和 RGB 值。点击任何颜色代码即可将其复制到剪贴板。在您的设计、CSS 或打印项目中使用这些代码。

工作原理

调色板生成器使用 OffscreenCanvas 元素和颜色量化算法来提取主色。当您上传图像时，浏览器通过 File API 直接将其读取到内存中，不会发生服务器上传。

libvips 使用 OffscreenCanvas 创建离屏画布，并使用 drawImage 以原始分辨率绘制您的图像。然后，它使用 getImageData 将像素数据读取为 RGBA 数组，该数组返回一个包含图像中每个像素的红、绿、蓝和 alpha 值的 Uint8ClampedArray。对于 1920x1080 的图像，这会产生大约 800 万个单独的颜色值。

量化算法使用 k-means 聚类根据颜色相似度对像素进行分组。它初始化 k 个聚类中心（k 等于您选择的调色板大小），然后根据 RGB 空间中的欧几里得距离迭代地将每个像素分配给最近的聚类中心。在每次分配后，它会重新计算每个聚类中心作为该聚类中所有像素的数学平均值。此过程重复进行，直到中心稳定或达到最大迭代次数。结果是一组代表图像视觉特征的代表性颜色。

每种颜色都显示为一个视觉色块，并附带其 HEX 代码和 RGB 值。libvips 对每个聚类的精确质心颜色进行采样，确保显示的色块准确代表该组中所有像素的数学平均值。

文件完全在您的浏览器中使用 OffscreenCanvas 进行处理。它们永远不会被上传到 ConvertCraft 服务器。

当出现问题时

图像上传失败：您的图像超过了 20 MB 的限制。OffscreenCanvas 在严格的内存限制内运行。处理超过 20 MB 的图像需要 RAM 中巨大的未压缩像素缓冲区，这可能会导致浏览器标签页崩溃。

调色板包含相似的颜色：图像具有算法视为不同聚类的细微颜色变化。减少调色板大小以获得更少、更独特的颜色。

颜色与我看到的不匹配：该算法提取的是数学平均值。颜色之间的感知差异可能与视觉感知不一致。尝试不同的调色板大小或对特定像素使用吸管工具。

调色板主要是单一颜色：您的图像由单一颜色主导。该算法忠实地呈现了图像的颜色分布。尝试使用颜色更丰富的不同图像。

### 我可以提取多少种颜色？

该工具支持提取 5、8、10 或 12 种颜色。颜色越少，调色板越简洁。颜色越多，捕捉到的细微差别就越多，但可能会包含视觉上不明显的细微差异。

### 我可以从特定区域提取颜色吗？

当前版本分析整个图像。要从特定区域提取颜色，请先使用图像转换器或专用裁剪工具裁剪图像，然后上传裁剪后的版本。

### 从私人图像中提取颜色安全吗？

是的。文件完全在您的浏览器中使用 OffscreenCanvas 进行处理。它们永远不会被上传到 ConvertCraft 服务器。您的图像数据永远不会离开您的计算机，从而使其完全免受网络拦截或服务器端日志记录的影响。