NCol Цвета
NCol Калькулятор
Natural Colors (NCol) - Натуральные цвета
Натуральные цвета (NCol) - это инициатива W3Schools.
Система предназначена для упрощения выбора HTML цветов.
NCol определяет цвета, используя цветовую букву с цифрой, чтобы указать расстояние (в процентах) от цвета.
R30 означает 30% от Red, движется навстречу Yellow. (Иными словами: красный из 30% желтого).
Буква | Цвет | Оттенки |
---|---|---|
R | Red |
R
R25
R50
R75
|
Y | Yellow |
Y
Y25
Y50
Y75
|
G | Green |
G
G25
G50
G75
|
C | Cyan |
C
C25
C50
C75
|
B | Blue |
B
B25
B50
B75
|
M | Magenta |
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, но он очень близок к новой системе цветов HWB, предложенной в CSS4.
Ожидая CSS4, вы можете включить библиотеку цветов W3Schools и использовать NCol в качестве HTML-атрибута, как здесь:
Пример
<div
data-w3-color="R50,50%,0">
<p>Київ - це столиця Великої України.
Це найбільш густонаселене місто Великої України,
з агломерацією понад 5 мільйонів жителів.</p>
</div>
<script src="../lib/w3color.js"></script>
Попробуйте
сами »
Библиотека цветов W3Schools
Библиотеку JavaScript, используемую в примере выше, можно скачать по ссылке:
https://www.w3schools.com/lib/w3color.js
Также вы можете воспользоваться альтернативным скачиванием с нашего сайта W3Schools на русском по ссылке: https://w3schoolsrus.github.io/lib/w3color.js
Почему NCol?
Объяснить цвета с помощью обозначений RGB или HEX очень сложно.
Можете ли вы сказать, что такое цвет rgb(199,21,133)?
RGB основан на том, как физически производить цвета, смешивая источники света.
NCol базируется на том, как цвета выглядят для человеческого глаза.
Благодаря этому NCol значительно облегчает описание цветов.
Впервые природные цвета описал Карл Эвальд Константин Геринг (Германия 1834 - 1918).
Уроки по использованию цветов на веб-страницах смотрите на нашем сайте W3Schools на русском в разделах HTML Цвета и CSS Цвета.