颜色 NCol
NCol 计算器
rgb(255, 0, 0)
#ff0000
hsl(0, 100%, 50%)
H
W
B
自然色 (NCol)
自然色 (NCol) 是 W3Schools 的一项倡议。
该系统旨在简化 HTML 颜色的选择。
NCol 使用颜色字母和数字来指定颜色距离(以百分比表示)。
R30 表示从**红色**偏离 30%,朝向**黄色**。(换句话说:红色带 30% 的黄色)
字母 | 颜色 | 色调 |
---|---|---|
R | 红色 |
R
R25
R50
R75
|
Y | 黄色 |
Y
Y25
Y50
Y75
|
G | 绿色 |
G
G25
G50
G75
|
C | 青色 |
C
C25
C50
C75
|
B | 蓝色 |
B
B25
B50
B75
|
M | 品红色 |
M
M25
M50
M75
|
R | Y | G | C | B | M | ||||||||||||||||||||||||||||||||||||||||||||||||||||||
颜色和距离也可以用色调(0-360)表示
R = 000 | Y = 060 | G = 120 | C = 180 | B = 240 | M = 300 |
HTML 支持
NCol 在 HTML 中不受支持,但它非常接近 CSS4 中建议的新 HWB 颜色系统。
在等待 CSS4 的同时,您可以包含 W3Schools 的颜色库,并将 NCol 作为 HTML 属性使用,如下所示
示例
<div data-w3-color="R50,50%,0">
<p>伦敦是英格兰的首都。
它是英国人口最多的城市,
都市区拥有超过 1300 万居民。</p>
</div>
<script src="/lib/w3color.js"></script>
亲自尝试 »
W3Schools 颜色库
上面示例中使用的 JavaScript 库可以从以下地址下载
https://w3schools.org.cn/lib/w3color.js
为什么选择 NCol?
尝试使用 RGB 或 HEX 表示法解释颜色非常困难。
你能说出 rgb(199,21,133) 是什么颜色吗?
RGB 基于如何通过混合光源来物理产生颜色。
NCol 基于颜色在人眼中的外观。
因此,NCol 使描述颜色变得更加容易。
自然色最早由卡尔·埃瓦尔德·康斯坦丁·赫林(德国 1834 - 1918 年)描述。