Кодирование цвета в HTML
(система RGB)


Изображение, которое мы видим на экране, сторится из точек. Каждая точка (или группа точек) имеет свой оттенок. Одна экранная точка называется пикселом (pixel). Если пиксел сильно увеличить, то можно различить в нем 3 люминофора (светящихся элемента), каждый из которых имеет свой цвет: красный, зеленый, синий. Кодируя цвет, мы задаем силу свечения каждого из люминофоров. Кодировка происходит чаще всего при помощи атрибута color, после которого ставится знак "=" и в кавычках указывается код цвета c "решеткой" в начале (то есть color="#ff00dd"). Это и есть система кодирования цвета RGB (от английских слов Red, Green, Blue). Каждый цвет кодируется двумя цифрами или буквами, таким образом мы имее 6 ячеек для кодировки цветов и их оттенков. В каждой из ячеек может быть любой символ из следующего ряда:

0,1,2,3,4,5,6,7,8,9,a,b,c,d,e,f
min.........................max

Таким образом, если все цвета будут на минимуме ("#000000"), мы получим на экране чёрный,
а если на максимуме ("#ffffff") - белый:

"#ffffff" 
"#000000" 

Если на максимум поставить только один цвет, то мы его и получим:

Redкрасный"#ff0000" 
Greenзеленый"#00ff00" 
Blueсиний"#0000ff" 

Из этих трех цветов комбинируются все цвета и оттенки.


Таблица базовых цветов:

Цвет Код
 #000000
 #888888
 #cccccc
 #ffffff
 #ff0000
 #ff00ff
 #880000
 #880088
 #000088
 #0000ff
 #00ffff
 #008800
 #00ff00
 #008888
 #ffff00
 #888800


Градации красного

Код Цвет Код Цвет
#000000 #880000
#110000 #990000
#200000 #aa0000
#330000 #bb0000
#440000 #cc0000
#550000 #dd0000
#660000 #ee0000
#770000 #ff0000

Код Цвет Код Цвет
#ff0000 #ff8888
#ff1111 #ff9999
#ff2222 #ffaaaa
#ff3333 #ffbbbb
#ff4444 #ffcccc
#ff5555 #ffdddd
#ff6666 #ffeeee
#ff7777 #ffffff


Градации зеленого

Код Цвет Код Цвет
#000000 #008800
#001100 #009900
#002200 #00aa00
#003300 #00bb00
#004400 #00cc00
#005500 #00dd00
#006600 #00ee00
#007700 #00ff00

Код Цвет Код Цвет
#00ff00 #88ff88
#11ff11 #99ff99
#22ff22 #aaffaa
#33ff33 #bbffbb
#44ff44 #ccffcc
#55ff55 #ddffdd
#66ff66 #eeffee
#77ff77 #ffffff


Градации синего

Код Цвет Код Цвет
#000000 #000088
#000011 #000099
#000022 #0000aa
#000033 #0000bb
#000044 #0000cc
#000055 #0000dd
#000066 #0000ee
#000077 #0000ff

Код Цвет Код Цвет
#000000 #000088
#000011 #000099
#000022 #0000aa
#000033 #0000bb
#000044 #0000cc
#000055 #0000dd
#000066 #0000ee
#000077 #0000ff


Палитра всех оттенков


Код Цвет
#00ffff 
#00eeff 
#00ddff 
#00ccff 
#00bbff 
#00aaff 
#0099ff 
#0088ff 
#0077ff 
#0066ff 
#0055ff 
#0044ff 
#0033ff 
#0022ff 
#0011ff 
#0000ff 
#1100ff 
#2200ff 
#3300ff 
#4400ff 
#5500ff 
#6600ff 
#7700ff 
#8800ff 
#9900ff 
#aa00ff 
#bb00ff 
#cc00ff 
#dd00ff 
#ee00ff 
#ff00ff 
#ff00ee 
#ff00dd 
#ff00cc 
#ff00bb 
#ff00aa 
#ff0099 
#ff0088 
#ff0077 
#ff0066 
#ff0055 
#ff0044 
#ff0033 
#ff0022 
#ff0011 
#ff0000 
#ff1100 
#ff2200 
#ff3300 
#ff4400 
#ff5500 
#ff6600 
#ff7700 
#ff8800 
#ff9900 
#ffaa00 
#ffbb00 
#ffcc00 
#ffdd00 
#ffee00 
#ffff00 
#eeff00 
#ddff00 
#ccff00 
#bbff00 
#aaff00 
#99ff00 
#88ff00 
#77ff00 
#66ff00 
#55ff00 
#44ff00 
#33ff00 
#22ff00 
#11ff00 
#00ff00 
#00ff11 
#00ff22 
#00ff33 
#00ff44 
#00ff55 
#00ff66 
#00ff77 
#00ff88 
#00ff99 
#00ffaa 
#00ffbb 
#00ffcc 
#00ffdd 
#00ffee 
#00ffff 

В данной таблице все оттенки имеют среднюю яркость.
Чтобы сделать оттенок темнее, надо уменьшить имеющиеся цвета;
Чтобы сделать оттенок светлее, надо пропорционально увеличить все цвета.

Рассмотрим на примере цвета "#0088ff" (в середине таблицы)

КодЦвет
#eeffff 
#cceeff 
#aaddff 
#88ccff 
#66bbff 
#44aaff 
#2299ff 
#0088ff 
#0077dd 
#0066bb 
#005599 
#004477 
#003355 
#002233 
#001122 
#000000 

НАЗАД    ДАЛЬШЕ