colourintell.
色彩智能全球标准

色彩解剖学与Color Intelligence

探索 ColourIntell:全球色彩智能引擎,提供 WCAG 2.2 对比度验证、3D 空间模拟、调色板生成器以及 1200+ 精选色彩库。

01 / 基础原理

什么是色彩?视觉的物理学与生物学

从物理本质上看,色彩并非物体固有的实体属性,而是人眼对波长在 380 纳米(紫色)至 750 纳米(深红)可见光谱内电磁辐射的知觉解析。

人类视觉为三色视觉:视网膜分布着短波 S 锥体(~420nm)、中波 M 锥体(~530nm)和长波 L 锥体(~560nm)。光线经由视锥细胞转化后在大脑视觉皮层解码为色相、饱和度和明度。

02 / 方法与理论

什么是色彩智能(Color Intelligence)?

色彩智能代表了光学物理、认知心理学、W3C 无障碍数学模型与生成式设计系统的融合,标志着数字色彩从主观臆断转向严谨工程。

在实际 Web 与应用开发中,纯凭直觉往往导致灾难性后果:文字可读性差、无障碍审计失败以及深色模式下视觉混乱。

ColourIntell.com 核心功能详解

无需注册、浏览器本地极速运算的全功能色彩操作系统,服务于全球设计师、工程师与创作者:

多色彩空间引擎

支持 HEX、RGB、HSL、HSV、CMYK、OKLCH、CIE XYZ、CIE Lab 间的双向瞬时高精度转换。

WCAG 2.2 无障碍实验室

根据 W3C 相对亮度公式实时测算 4.5:1 (AA) 与 7:1 (AAA) 对比度合规性。

几何调和算法

快速生成互补、近似、三角色、矩形四角色等调和调色板。

知觉色阶系统 (50–950)

在 OKLCH 空间中生成 11 阶无色偏的系统级设计系统色阶。

ColourIntell AI 助手

基于 Gemini 自然语言模型,将概念描述一键转化为完整配色与 UI 实时预览。

视觉认知训练游戏

包含辨色敏锐度、HEX 代码盲猜和无障碍反应力等专业训练游戏。

多框架工程导出

一键生成 CSS 变量 (:root)、Tailwind 配置、Figma Design Tokens (JSON) 及 CMYK 印刷参数。

100% 本地隐私安全

图片色彩提取与量化计算全部在浏览器 HTML5 Canvas 中完成,零图片外传。

Frequently Asked Questions

什么是 ColourIntell?它适合哪些用户?

ColourIntell 是专为 UI/UX 设计师、前端开发者、设计系统架构师和品牌创作者打造的全球色彩智能平台。它将专业级科学色彩空间转换(HEX、RGB、HSL、HSV、CMYK、OKLCH、CIE XYZ、CIE Lab)与 WCAG 2.2 无障碍合规性验证、智能调和调色板生成以及即时代码导出完美结合。

ColourIntell 如何计算 WCAG 2.2 颜色对比度?

ColourIntell 采用 W3C 官方相对亮度公式:(L1 + 0.05) / (L2 + 0.05)。通过伽马扩展将 sRGB 线性化,并根据人眼光谱灵敏度权重(0.2126R + 0.7152G + 0.0722B)精确计算相对亮度。正文对比度达到 4.5:1 即符合 AA 级别,大字号或 UI 达到 3.0:1 符合 AA,达到 7.0:1 即可达成最高 AAA 级别标准。

HEX、RGB、HSL 与 OKLCH 之间有什么区别?

HEX 和 RGB 是面向屏幕显示的加色模型,对应红、绿、蓝发光通道。HSL 提供了直观的色相、饱和度和明度坐标,但缺乏知觉均匀性。OKLCH 是由 Björn Ottosson 研发的新一代知觉色彩空间,其明度坐标精准对应人眼光学感知,是现代高可访问性 UI 设计系统的黄金标准。

从图片中提取调色板是否安全私密?

是的,100% 安全私密。所有色彩提取和量化计算完全在您本地浏览器的 HTML5 Canvas 与 JavaScript 中运行。您的图片、设计稿和截图绝不会上传至任何远程服务器或数据库。

几何色彩调和是如何计算的?

调和色彩基于 360° 色相环上的数学角度关系严密计算:互补色(180° 对立)、近似色(±30° 相邻)、三色调和(120° 等边三角形)、分裂互补色(150° 与 210°)以及四色调和(90° 矩形对称)。

我可以在商业项目中使用 ColourIntell 生成的颜色和设计令牌吗?

完全可以。ColourIntell 生成的所有 CSS 变量、Tailwind 配置代码片段以及 JSON 设计令牌均为开源开放,个人与商业产品均可免版税使用,无需署名或许可授权。

colourintell.