图片主色调提取
图片主色调提取
Cancel

上传图片后,自动分析全部像素并提取主色调。支持三种经典色彩量化算法,颜色数量与采样精度可调,结果按占比排序输出 HEX 与 RGB 值,并生成 Swift / Objective-C / Kotlin / Java / ArkTS / Flutter 代码片段。所有处理均在浏览器本地完成,图片不会上传到任何服务器

几点说明:

  • 上传:选择或拖拽图片(PNG / JPEG / WebP / GIF / BMP 等),图片在本地 Canvas 渲染,超大图自动缩放至 1200px 以内
  • 提取算法:
    • K-Means 聚类(k-means++ 初始化)— 经典聚类,色彩分布均匀
    • 中值切割(Median Cut, Heckbert 1982)— Color Thief 同源算法,速度快
    • 直方图统计 — 3D 色彩直方图量化 + 相似色合并,适合提取离散主色
  • 颜色数量:3 / 5 / 7 / 10 色可选
  • 采样精度:控制像素采样步长,步长越大速度越快但精度略降
  • 输出:每个颜色显示 HEX 字符串、RGB 值、占比百分比,均可一键复制
  • 代码片段:自动生成 Swift / Objective-C / Kotlin / Java / ArkTS / Flutter 代码,语言标签可切换
  • 算法源码:提供 Swift / Objective-C / JavaScript 三种语言的三种算法完整实现,方便学习和修改
上传图片后选择算法提取主色调,生成多语言代码片段,纯本地处理,图片不上传
或将图片拖拽到此处

算法源码

三种色彩量化算法的完整实现,提供 Swift / Objective-C / JavaScript 三个版本,方便学习和移植到自己的项目。