About Color Palette Extraction & Color Spaces
Color palette extraction identifies the most prominent and aesthetically matching colors from an image. Designers use these dominant palettes to establish consistent themes and color tokens in visual design systems, UI components, and brand identities.
How to use the Color Tool
1. Upload Graphic Asset: Select or drop your design mockup, UI screenshot, or photograph.
2. Inspect Dominant Colors: The tool analyzes the canvas pixel matrix to output the top 8 dominant color clusters. Clicking any color card copies its HEX representation.
3. Use Magnifier Picker: Move your cursor over the image. The real-time pixel magnifier amplifies the color values. Click to lock and copy the colors (HEX, RGB, HSL).
Local Color Analysis
Our extractor uses downsampled color-clustering algorithms that group adjacent RGB vectors into distinct color space buckets. This math runs entirely client-side, providing an instantaneous, privacy-safe UI. No images are uploaded to any server.
关于图片色板提取与色彩空间
图片色板提取用于分析图片像素的色彩频率分布，并自动归纳提炼出最具视觉代表性的核心配色方案。网页开发者和设计师可以借此快速获取设计稿的视觉主色调调色板，用于制定 UI 组件配色和 Design Tokens 视觉规范。
如何使用色板取色工具
1. 上传图像资源：选择或拖放您的界面截图、设计原型图或照片。
2. 提炼主色调：工具会自动计算并输出最核心的 8 个色彩调色板。点击任何色块可以一键复制其十六进制 HEX 代码。
3. 移动放大镜精准取色：在图片画布上移动鼠标，放大镜会实时放大显示精细像素，点击鼠标可以锁定该位置像素并复制其 HEX / RGB / HSL 编码。
本地色彩算法分析
本工具通过在浏览器本地 Canvas 绘制并对图像像素矩阵进行空间颜色聚合算法（Color Clustering），从而快速对大色域进行色域收敛并筛选主色。计算完全由客户端 CPU 运算，无需等待上传网络，100% 离线隐私运行。