В HTML с помощью специального кода можно изменить цвет текста, фона, ссылки, шрифта, таблицы или всей страницы.

Цвет в HTML

Значение для свойства color можно задать тремя основными способами:

  • по названию цвета: red, green, blue, gold, olive, magenta, cyan, brown и так далее
  • по шестнадцатеричному значению (hexadecimal number): от #000000 до #ffffff
  • по коду цвета в RGB палитре: от rgb(0, 0, 0) до rgb(255, 255, 255)

С названием цвета все относительно просто. Единственное ограничение в том, что мы должны выбирать цвет из нескольких предустановленных вариантов.

В стандартном наборе HTML 140 цветов и если тебе нужен будет какой-то цвет, который не представлен там, то нужно будет использовать шестнадцатеричный формат (HEX код) или RGB.

HEX код для цвета в HTML

HEX код всегда начинается с символа # за которым следует трехбайтовое шестнадцатеричное число (всего 6 цифр). Каждый байт отвечает за интенсивность одного из трех основных цветов: первый отвечает за интенсивность красного цвета, второй — зеленого, третий — синего:

Значение 00 - самая низкая интенсивность, FF - самая высокая. Например, для получения белого цвета нужно “смешать” три основных цвета с максимальной интенсивностью: #FFFFFF. Для получения черного цвета, соответственно, интенсивность всех цветом должна быть минимальной: #000000.

— Так это же как на уроках рисования — для получения любого цвета нужно просто смешать красный, синий и зеленый.

— Точно. Для получения красного цвета нужно байту, отвечающий за красный цвет установить максимальное значение, а для остальных — минимальное: ##FF0000.

— Тогда для зеленого HEX код будет таким: #00FF00.

RGB палитра HTML цветов

В RGB палитре цвет добавляется по такому же, принципу: задается интенсивность красного (red), зеленого (green) и синего (blue) цветов. От сюда и аббревиатура RGB. Только интенсивность указываться здесь числами 0 от 225, где 0 - самая низкая интенсивность, 225 - самая высокая. Для примера, зеленый цвет будет выглядеть следующим образом: rgb(0, 225, 0);

Все эти значения подходят и для других ситуаций, где нужен цвет, например в background-color.

Таблица из 140 HTML цветов с названиями и кодами (строка, HEX, rgb)

В этой таблице все HTML цвета у которых есть английское название и HTML код. Если ты хочешь стать FULL STACK JS разработчиком - регистрируйся бесплатно на мой курс по веб программированию

ЦветНазваниеHTML КодHEX кодRGB код
 бордовыйmaroon#800000(128,0,0)
 темно-красныйdarkred#8B0000(139,0,0)
 коричневыйbrown#A52A2A(165,42,42)
 кирпичныйfirebrick#B22222(178,34,34)
 малиновыйcrimson#DC143C(220,20,60)
 красныйred#FF0000(255,0,0)
 томатныйtomato#FF6347(255,99,71)
 коралловыйcoral#FF7F50(255,127,80)
 индийский красныйindianred#CD5C5C(205,92,92)
 светлый кораллlightcoral#F08080(240,128,128)
 темный лососьdarksalmon#E9967A(233,150,122)
 лососьsalmon#FA8072(250,128,114)
 светлый лососьlightsalmon#FFA07A(255,160,122)
 оранжево-красныйorangered#FF4500(255,69,0)
 темно-оранжевыйdarkorange#FF8C00(255,140,0)
 оранжевыйorange#FFA500(255,165,0)
 золотойgold#FFD700(255,215,0)
 темно-золотойdarkgoldenrod#B8860B(184,134,11)
 золотистыйgoldenrod#DAA520(218,165,32)
 бледно-золотойpalegoldenrod#EEE8AA(238,232,170)
 темный хакиdarkkhaki#BDB76B(189,183,107)
 хакиkhaki#F0E68C(240,230,140)
 оливковыйolive#808000(128,128,0)
 желтыйyellow#FFFF00(255,255,0)
 желто-зеленыйyellowgreen#9ACD32(154,205,50)
 темно-оливковыйdarkolivegreen#556B2F(85,107,47)
 оливково-зеленыйolivedrab#6B8E23(107,142,35)
 салатовыйlawngreen#7CFC00(124,252,0)
 шартрезchartreuse#7FFF00(127,255,0)
 зелено-желтыйgreenyellow#ADFF2F(173,255,47)
 темно-зеленыйdarkgreen#006400(0,100,0)
 зеленыйgreen#008000(0,128,0)
 зеленый лесforestgreen#228B22(34,139,34)
 лаймlime#00FF00(0,255,0)
 зеленый лаймlimegreen#32CD32(50,205,50)
 светло-зеленыйlightgreen#90EE90(144,238,144)
 бледно-зеленыйpalegreen#98FB98(152,251,152)
 темно-зеленое мореdarkseagreen#8FBC8F(143,188,143)
 средне-весенний зеленыйmediumspringgreen#00FA9A(0,250,154)
 весенний зеленыйspringgreen#00FF7F(0,255,127)
 зеленое мореseagreen#2E8B57(46,139,87)
 средний аквамаринmediumaquamarine#66CDAA(102,205,170)
 средне-зеленое мореmediumseagreen#3CB371(60,179,113)
 светло-зеленое мореlightseagreen#20B2AA(32,178,170)
 темно-серыйdarkslategray#2F4F4F(47,79,79)
 бирюзовыйteal#008080(0,128,128)
 темно-голубойdarkcyan#008B8B(0,139,139)
 водаaqua#00FFFF(0,255,255)
 голубойcyan#00FFFF(0,255,255)
 светло-голубойlightcyan#E0FFFF(224,255,255)
 темно-бирюзовыйdarkturquoise#00CED1(0,206,209)
 бирюзовыйturquoise#40E0D0(64,224,208)
 средне-бирюзовыйmediumturquoise#48D1CC(72,209,204)
 бледно-бирюзовыйpaleturquoise#AFEEEE(175,238,238)
 аквамаринaquamarine#7FFFD4(127,255,212)
 синий порошокpowderblue#B0E0E6(176,224,230)
 кадетский синийcadetblue#5F9EA0(95,158,160)
 стальной синийsteelblue#4682B4(70,130,180)
 васильковыйcornflowerblue#6495ED(100,149,237)
 темно-голубойdeepskyblue#00BFFF(0,191,255)
 синеватыйdodgerblue#1E90FF(30,144,255)
 светло-синийlightblue#ADD8E6(173,216,230)
 небесныйskyblue#87CEEB(135,206,235)
 светло-небесныйlightskyblue#87CEFA(135,206,250)
 полуночно-синийmidnightblue#191970(25,25,112)
 флотnavy#000080(0,0,128)
 темно-синийdarkblue#00008B(0,0,139)
 средне-синийmediumblue#0000CD(0,0,205)
 синийblue#0000FF(0,0,255)
 королевский синийroyalblue#4169E1(65,105,225)
 сине-фиолетовыйblueviolet#8A2BE2(138,43,226)
 индигоindigo#4B0082(75,0,130)
 темно-грифельный синийdarkslateblue#483D8B(72,61,139)
 грифельно-синийslateblue#6A5ACD(106,90,205)
 средне-грифельно синийmediumslateblue#7B68EE(123,104,238)
 средне-фиолетовыйmediumpurple#9370DB(147,112,219)
 темно-пурпурныйdarkmagenta#8B008B(139,0,139)
 темно-фиолетовыйdarkviolet#9400D3(148,0,211)
 темная орхидеяdarkorchid#9932CC(153,50,204)
 средняя орхидеяmediumorchid#BA55D3(186,85,211)
 фиолетовыйpurple#800080(128,0,128)
 чертополохthistle#D8BFD8(216,191,216)
 сливаplum#DDA0DD(221,160,221)
 лиловыйviolet#EE82EE(238,130,238)
 фуксияfuchsia#FF00FF(255,0,255)
 орхидеяorchid#DA70D6(218,112,214)
 средне-фиолетовый красныйmediumvioletred#C71585(199,21,133)
 бледно-фиолетовый красныйpalevioletred#DB7093(219,112,147)
 темно-розовыйdeeppink#FF1493(255,20,147)
 ярко-розовыйhotpink#FF69B4(255,105,180)
 светло-розовыйlightpink#FFB6C1(255,182,193)
 розовыйpink#FFC0CB(255,192,203)
 антично-белыйantiquewhite#FAEBD7(250,235,215)
 бежевыйbeige#F5F5DC(245,245,220)
 бисквитbisque#FFE4C4(255,228,196)
 бланшированный миндальblanchedalmond#FFEBCD(255,235,205)
 пшеничныйwheat#F5DEB3(245,222,179)
 кукурузный шелкcornsilk#FFF8DC(255,248,220)
 лимонный шифонlemonchiffon#FFFACD(255,250,205)
 светло-золотой желтыйlightgoldenrodyellow#FAFAD2(250,250,210)
 светло-желтыйlightyellow#FFFFE0(255,255,224)
 коричневое седлоsaddlebrown#8B4513(139,69,19)
 сиеннаsienna#A0522D(160,82,45)
 шоколадныйchocolate#D2691E(210,105,30)
 перуperu#CD853F(205,133,63)
 песочно-коричневыйsandybrown#F4A460(244,164,96)
 крепкое деревоburlywood#DEB887(222,184,135)
 загарtan#D2B48C(210,180,140)
 розово-коричневыйrosybrown#BC8F8F(188,143,143)
 мокасиныmoccasin#FFE4B5(255,228,181)
 белый навахоnavajowhite#FFDEAD(255,222,173)
 персиковыйpeachpuff#FFDAB9(255,218,185)
 туманная розаmistyrose#FFE4E1(255,228,225)
 лавандовыйlavenderblush#FFF0F5(255,240,245)
 бельеlinen#FAF0E6(250,240,230)
 старое кружевоoldlace#FDF5E6(253,245,230)
 папайаpapayawhip#FFEFD5(255,239,213)
 морская ракушкаseashell#FFF5EE(255,245,238)
 мятный кремmintcream#F5FFFA(245,255,250)
 серый шиферslategray#708090(112,128,144)
 светло-серый шиферlightslategray#778899(119,136,153)
 светло-стальной голубойlightsteelblue#B0C4DE(176,196,222)
 лавандовыйlavender#E6E6FA(230,230,250)
 цветочно-белыйfloralwhite#FFFAF0(255,250,240)
 синяя алисаaliceblue#F0F8FF(240,248,255)
 призрачно-белыйghostwhite#F8F8FF(248,248,255)
 медовая росаhoneydew#F0FFF0(240,255,240)
 слоновая костьivory#FFFFF0(255,255,240)
 лазурныйazure#F0FFFF(240,255,255)
 снежныйsnow#FFFAFA(255,250,250)
 черныйblack#000000(0,0,0)
 тускло-серыйdimgray#696969(105,105,105)
 серыйgray#808080(128,128,128)
 темно-серыйdarkgray#A9A9A9(169,169,169)
 серебристыйsilver#C0C0C0(192,192,192)
 светло-серыйlightgray#D3D3D3(211,211,211)
 гейнсбороgainsboro#DCDCDC(220,220,220)
 белый дымwhitesmoke#F5F5F5(245,245,245)
 белыйwhite#FFFFFF(255,255,255)