Цвет в html rgb: Конвертер Цветов Онлайн — HEX ⇒ RGB ⇒ RGBA ⇒ CMYK ⇒ HSL ⇒ HSLA ⇒ HSB ⇒ HSV ⇒ XYZ ⇒ LAB. Калькулятор цветов HTML. Генератор цветов CSS3 — ColorScheme.Ru

Содержание

HTML цвета

Подробную информацию об использовании цветов в HTML и CSS, способах указания цвета с помощью шестнадцатеричных значений, значений цвета RGB, RGBA, HSL, HSLA и с помощью предопределённых цветов, вы сможете найти в следующих статьях учебников:

Конвертер цветов

Конвертер цветов позволяет преобразовать (конвертировать) RGB цвета (аббревиатура английских слов red, green, blueкрасный, зелёный, синий) в шестнадцатеричные (HEX) значения, RGB цвета в формат HSL (от англ. hue, saturation, lightness (intensity) — тон, насыщенность и осветленность) и обратно HEX значения в RGB и HSL цвета.

Предопределенные имена цветов

Красные
Имя цветаHEXRGB
IndianRed #CD5C5C rgb(205, 92, 92)
LightCoral #F08080 rgb(240, 128, 128)
Salmon #FA8072 rgb(250, 128, 114)
DarkSalmon #E9967A rgb(233, 150, 122)
LightSalmon #FFA07A rgb(255, 160, 122)
Crimson #DC143C rgb(220, 20, 60)
Red #FF0000 rgb(255, 0, 0)
FireBrick #B22222 rgb(178, 34, 34)
DarkRed #8B0000 rgb(139, 0, 0)
Жёлтые
Имя цветаHEXRGB
Gold #FFD700 rgb(255, 215, 0)
Yellow #FFFF00 rgb(255, 255, 0)
LightYellow #FFFFE0 rgb(255, 255, 224)
LemonChiffon #FFFACD rgb(255, 250, 205)
LightGoldenrodYellow #FAFAD2 rgb(250, 250, 210)
PapayaWhip #FFEFD5 rgb(255, 239, 213)
Moccasin #FFE4B5 rgb(255, 228, 181)
PeachPuff #FFDAB9 rgb(255, 218, 185)
PaleGoldenrod #EEE8AA rgb(238, 232, 170)
Khaki #F0E68C rgb(240, 230, 140)
DarkKhaki #BDB76B rgb(189, 183, 107)
Оранжевые
Имя цветаHEXRGB
Coral #FF7F50 rgb(255, 127, 80)
Tomato #FF6347 rgb(255, 99, 71)
OrangeRed #FF4500 rgb(255, 69, 0)
DarkOrange #FF8C00 rgb(255, 140, 0)
Orange #FFA500 rgb(255, 165, 0)
Розовые
Имя цветаHEXRGB
Pink #FFC0CB rgb(255, 192, 203)
LightPink #FFB6C1 rgb(255, 182, 193)
HotPink #FF69B4 rgb(255, 105, 180)
DeepPink #FF1493 rgb(255, 20, 147)
MediumVioletRed #C71585 rgb(199, 21, 133)
PaleVioletRed #DB7093 rgb(219, 112, 147)
Фиолетовые
Имя цветаHEXRGB
Lavender #E6E6FA rgb(230, 230, 250)
Thistle #D8BFD8 rgb(216, 191, 216)
Plum #DDA0DD rgb(221, 160, 221)
Violet #EE82EE
rgb(238, 130, 238)
Orchid #DA70D6 rgb(218, 112, 214)
Fuchsia(Magenta) #FF00FF rgb(255, 0, 255)
MediumOrchid #BA55D3 rgb(186, 85, 211)
MediumPurple #9370DB rgb(147, 112, 219)
BlueViolet #8A2BE2 rgb(138, 43, 226)
DarkViolet #9400D3 rgb(148, 0, 211)
DarkOrchid #9932CC rgb(153, 50, 204)
DarkMagenta #8B008B rgb(139, 0, 139)
Purple #800080 rgb(128, 0, 128)
Indigo #4B0082 rgb(75, 0, 130)
SlateBlue #6A5ACD rgb(106, 90, 205)
DarkSlateBlue #483D8B rgb(72, 61, 139)
Коричневые
Имя цветаHEXRGB
Cornsilk
#FFF8DC rgb(255, 248, 220)
BlanchedAlmond #FFEBCD rgb(255, 235, 205)
Bisque #FFE4C4 rgb(255, 228, 196)
NavajoWhite #FFDEAD rgb(255, 222, 173)
Wheat #F5DEB3 rgb(245, 222, 179)
BurlyWood #DEB887 rgb(222, 184, 135)
Tan #D2B48C rgb(210, 180, 140)
RosyBrown #BC8F8F rgb(188, 143, 143)
SandyBrown #F4A460 rgb(244, 164, 96)
Goldenrod #DAA520 rgb(218, 165, 32)
DarkGoldenrod #B8860B rgb(184, 134, 11)
Peru #CD853F rgb(205, 133, 63)
Chocolate #D2691E rgb(210, 105, 30)
SaddleBrown #8B4513 rgb(139, 69, 19)
Sienna #A0522D rgb(160, 82, 45)
Brown #A52A2A rgb(165, 42, 42)
Maroon #800000 rgb(128, 0, 0)
Синие
Имя цветаHEXRGB
Aqua(Cyan) #00FFFF rgb(0, 255, 255)
LightCyan #E0FFFF rgb(224, 255, 255)
PaleTurquoise #AFEEEE rgb(175, 238, 238)
Aquamarine #7FFFD4 rgb(127, 255, 212)
Turquoise #40E0D0 rgb(64, 224, 208)
MediumTurquoise #48D1CC rgb(72, 209, 204)
DarkTurquoise #00CED1 rgb(0, 206, 209)
CadetBlue #5F9EA0 rgb(95, 158, 160)
SteelBlue #4682B4 rgb(70, 130, 180)
LightSteelBlue #B0C4DE
rgb(176, 196, 222)
PowderBlue #B0E0E6 rgb(176, 224, 230)
LightBlue #ADD8E6 rgb(173, 216, 230)
SkyBlue #87CEEB rgb(135, 206, 235)
LightSkyBlue #87CEFA rgb(135, 206, 250)
DeepSkyBlue #00BFFF rgb(0, 191, 255)
DodgerBlue #1E90FF rgb(30, 144, 255)
CornflowerBlue #6495ED rgb(100, 149, 237)
MediumSlateBlue #7B68EE rgb(123, 104, 238)
RoyalBlue #4169E1 rgb(65, 105, 225)
Blue #0000FF rgb(0, 0, 255)
MediumBlue #0000CD rgb(0, 0, 205)
DarkBlue #00008B rgb(0, 0, 139)
Navy #000080 rgb(0, 0, 128)
MidnightBlue #191970 rgb(25, 25, 112)
Имя цветаHEXRGB
Зелёные
GreenYellow #ADFF2F rgb(173, 255, 47)
Chartreuse #7FFF00 rgb(127, 255, 0)
LawnGreen #7CFC00 rgb(124, 252, 0)
Lime #00FF00 rgb(0, 255, 0)
LimeGreen #32CD32 rgb(50, 205, 50)
PaleGreen #98FB98 rgb(152, 251, 152)
LightGreen #90EE90 rgb(144, 238, 144)
MediumSpringGreen #00FA9A rgb(0, 250, 154)
SpringGreen #00FF7F rgb(0, 255, 127)
MediumSeaGreen #3CB371 rgb(60, 179, 113)
SeaGreen #2E8B57 rgb(46, 139, 87)
ForestGreen #228B22 rgb(34, 139, 34)
Green
#008000 rgb(0, 128, 0)
DarkGreen #006400 rgb(0, 100, 0)
YellowGreen #9ACD32 rgb(154, 205, 50)
OliveDrab #6B8E23 rgb(107, 142, 35)
Olive #808000 rgb(128, 128, 0)
DarkOliveGreen #556B2F rgb(85, 107, 47)
MediumAquamarine #66CDAA rgb(102, 205, 170)
DarkSeaGreen #8FBC8F rgb(143, 188, 143)
LightSeaGreen #20B2AA rgb(32, 178, 170)
DarkCyan #008B8B rgb(0, 139, 139)
Teal #008080 rgb(0, 128, 128)
Белые
Имя цветаHEXRGB
White #FFFFFF rgb(255, 255, 255)
Snow #FFFAFA rgb(255, 250, 250)
Honeydew #F0FFF0 rgb(240, 255, 240)
MintCream #F5FFFA rgb(245, 255, 250)
Azure #F0FFFF rgb(240, 255, 255)
AliceBlue #F0F8FF rgb(240, 248, 255)
GhostWhite #F8F8FF rgb(248, 248, 255)
WhiteSmoke #F5F5F5 rgb(245, 245, 245)
Seashell #FFF5EE rgb(255, 245, 238)
Beige #F5F5DC rgb(245, 245, 220)
OldLace #FDF5E6 rgb(253, 245, 230)
FloralWhite #FFFAF0 rgb(255, 250, 240)
Ivory #FFFFF0 rgb(255, 255, 240)
AntiqueWhite #FAEBD7 rgb(250, 235, 215)
Linen #FAF0E6 rgb(250, 240, 230)
LavenderBlush #FFF0F5 rgb(255, 240, 245)
MistyRose #FFE4E1 rgb(255, 228, 225)
Серые
Имя цветаHEXRGB
Gainsboro#DCDCDC(220, 220, 220)
LightGray #D3D3D3 rgb(211, 211, 211)
Silver #C0C0C0 rgb(192, 192, 192)
DarkGray #A9A9A9 rgb(169, 169, 169)
Gray #808080 rgb(128, 128, 128)
DimGray #696969 rgb(105, 105, 105)
LightSlateGray #778899 rgb(119, 136, 153)
SlateGray #708090 rgb(112, 128, 144)
DarkSlateGray #2F4F4F rgb(47, 79, 79)
Black #000000 rgb(0, 0, 0)

Названия, HEX и RGB коды цветов в HTML

ЦветRGB кодHEX кодНазвание цветаНазвание цвета на англ.
 000000000#000000ЧерныйBlack
 000000128#000080Темно-синийNavy
 000000139#00008bТемно-голубойDarkblue
 000000205#0000cdУмеренно-голубойMediumblue
 000000255#0000ffСинийBlue
 000100000#006400Темно-зеленыйDarkgreen
 000128000#008000ЗеленыйGreen
 000128128#008080ЧайныйTeal
 000139139#008b8bТемный цианDarkcyan
 000191255#00bfffТемный небесно-синийDeepskyblue
 000206209#00ced1Темно-бирюзовыйDarkturquoise
 000250154#00fa9aУмеренный синевато-серыйMediumspringgreen
 000255000#00ff00ИзвестковыйLime
 000255127#00ff7fВесенний зеленыйSpringgreen
 000255255#00ffffМорской волныAqua
 025025112#191970Ночной синийMidnightblue
 030144255#1e90ffТускло-васильковыйDodgerblue
 032178170#20b2aaСветлой морской волныLightseagreen
 034139034#228b22Лесной зеленыйForestgreen
 046139087#2e8b57Морской зеленыйSeagreen
 047079079#2f4f4fТемный синевато-серыйDarkslategray
 050205050#32cd32Зеленовато-известковыйLimegreen
 060179113#3cb371Умеренной морской волныMediumseagreen
 064224208#40e0d0БирюзовыйTurquoise
 065105225#4169e1Королевский голубойRoyalblue
 070130180#4682b4Голубовато-стальнойSteelblue
 072061139#483d8bТемный серовато-синийDarkslateblue
 072209204#48d1ccУмеренно-бирюзовыйMediumturquoise
 075000130#4b0082ИндигоIndigo
 085107047#556b2fТемно-оливковыйDarkolivegreen
 095158160#5f9ea0Блеклый серо-голубойCadetblue
 100149237#6495edВасильковыйCornflowerblue
 102205170#66cdaaУмеренно-аквамариновыйMediumaaquamarine
 105105105#696969Тускло-серыйDimgray
 106090205#6a5acdСеровато-синийSlateblue
 107142035#6b8e23Тускло-коричневыйOlivedrab
 112128144#708090Синевато-серыйSlategray
 119136153#778899Светлый синевато-серыйLightslategray
 123104238#7b68eeУмеренный серовато-синийMediumslateblue
 124252000#7cfc00Зеленой травыLawngreen
 127255000#7fff00ФисташковыйChartreuse
 127255212#7fffd4АквамаринAquamarine
 128000000#800000Оранжево-розовыйMaroon
 128000128#800080ПурпурныйPurple
 128128000#808000ОливковыйOlive
 128128128#808080СерыйGray
 135206235#87ceebНебесно-голубойSkyblue
 135206250#87cefaСветлый небесно-синийLightskyblue
 138043226#8a2be2Светло-фиолетовыйBlueviolet
 139000000#8b0000Темно-красныйDarkred
 139000139#8b008bТемный фуксинDarkmagenta
 139069019#8b4513Старой кожиSaddlebrown
 143188143#8fbc8fТемный морской волныDarkseagreen
 147112219#9370dbУмеренно-пурпурныйMediumpurple
 148000211#9400d3Темно-фиолетовыйDarkviolet
 152251152#98fb98Бледно-зеленыйPalegreen
 153050204#9932ccТемно-орхидейныйDarkorchid
 154205050#9acd32Желто-зеленыйYellowgreen
 156238144#9cee90Светло-зеленыйLightgreen
 160082045#a0522dОхраSienna
 165042042#a52a2aКоричневыйBrown
 169169169#a9a9a9Темно-серыйDarkgray
 173216230#add8e6Светло-голубойLightblue
 173255047#adff2fЖелто-зеленыйGreenyellow
 175238238#afeeeeБледно-бирюзовыйPaleturquise
 176196222#b0c4deСветло-стальнойLightsteelblue
 176224230#b0e0e6Туманно-голубойPowderblue
 178034034#b22222Огнеупорного кирпичаFirebrick
 184134011#b8860bТемный красно-золотойDarkgoldenrod
 186085211#ba55d3Умеренно-орхидейныйMediumorchid
 188143143#bc8f8fРозово-коричневыйRosybrown
 189183107#bdb76bТемный хакиDarkkhaki
 192192192#c0c0c0СеребристыйSilver
 199021133#c71585Умеренный красно-фиолетовыйMediumvioletred
 205092092#cd5c5cЯрко-красныйIndianred
 205133063#cd853fКоричневыйPeru
 210105030#d2691eШоколадныйChocolate
 210180140#d2b48cЖелтовато-коричневыйTan
 211211211#d3d3d3Светло-серыйLightgray
 216191216#d8bfd8ЧертополохаThistle
 218112214#da70d6ОрхидейныйOrchid
 218165032#daa520Красного золотаGoldenrod
 219112147#db7093Бледный красно-фиолетовыйPlaevioletred
 220020060#dc143cМалиновыйCrimson
 220220220#dcdcdcСветлый серо-фиолетовыйFainsboro
 221160221#dda0ddСливовыйPlum
 222184135#deb887Старого дереваBurlywood
 224255255#e0ffffСветлый цианLightcyan
 230230250#e6e6faБледно-лиловыйLavender
 233150122#e9967aТемный оранжево-розовыйDarksalmon
 238130238#ee82eeФиолетовыйViolet
 238232170#eee8aaБледно-золотойPalegoldenrod
 240128128#f08080Светло-коралловыйLightcoral
 240230140#f0e68cХакиKhaki
 240248255#f0f8ffБлекло-голубойAliceblue
 240255240#f0fff0Свежего медаHoneydew
 240255255#f0ffffЛазурьAzure
 244164096#f4a460Рыже-коричневыйSandybrown
 245222179#f5deb3ПшеничныйWheat
 245245220#f5f5dcБежевыйBeige
 245245245#f5f5f5Белый дымчатыйWhitesmoke
 245255250#f5fffaМятно-кремовыйMintcream
 248248255#f8f8ffТуманно-белыйGhostwhite
 250128114#fa8072Оранжево-розовыйSalmon
 250235215#faebd7Античный белыйAntuquewhite
 250240230#faf0e6ЛьнянойLinen
 253245230#fdf5e6Старого коньякаOldlace
 255000255#ff00ffФуксияFuchsia
 255020147#ff1493Темно-розовыйDeeppink
 255069000#ff4500Красно-оранжевыйOrangered
 255099071#ff6347ТоматныйTomato
 255105180#ff69b4Ярко-розовыйHotpink
 255127080#ff7f50КоралловыйCoral
 255140000#ff8c00Темно-оранжевыйDarkorange
 255160122#ffa07aСветлый оранжево-розовыйLightsalmon
 255165000#ffa500ОранжевыйOrange
 255182193#ffb6c1Светло-розовыйLightpink
 255192203#ffc0cbРозовыйPink
 255215000#ffd700ЗолотойGold
 255218185#ffdab9ПерсиковыйPeachpuff
 255222173#ffdeadГрязно-серыйNavajowhite
 255228181#ffe4b5БолотныйMoccasin
 255228196#ffe4c4БисквитныйBisque
 255228225#ffe4e1Туманно-розовыйMistyrose
 255235205#ffebcdСветло-кремовыйBlanchedalmond
 255239213#ffefd5ДыниPapayaawhip
 255240245#fff0f5Бледный розово-лиловыйLavenderblush
 255245238#fff5eeМорской пеныSeashell
 255248220#fff8dcБледно-желтыйCornsilk
 255250205#fffacdЛимонныйLemonchiffon
 255250240#fffaf0Цветочно-белыйFloralwhite
 255250250#fffafaСнежныйSnow
 255255000#ffff00ЖелтыйYellow
 255255224#ffffe0Светло-желтыйLightyellow
 255255240#fffff0Слоновой костиIvory
 255255255#ffffffБелыйWhite

HTML цвета. Имена цветов HTML, CSS, SVG.

Одной из составляющих представления веб-страниц в интернете является цвет, современные браузеры принимают и воспроизводят его, используя цветовые модели RGB, HSL, или же ключевые слова (названия).

Значения цвета в HTML может быть задано одним из следующих способов.

  • RGB:
    в шестнадцатеричном коде (hex): #008800 или его сокращенном написании: #080.
    в процентах: rgb(80%, 20%, 30%),
    числами от 0 до 255: rgb(240, 120, 10).
  • По имени:
    Teal или teal (регистр значения не имеет).
  • HSL:
    в процентах: hsl(195, 60%, 40%).
Стандарт W3C HTML 4.01 определяет имена 16 цветов:
ИмяR G BH S L
white #ffffff 255, 255, 255 0°, 0%, 100%
silver #c0c0c0 192, 192, 192 0°, 0%, 75%
gray #808080 128, 128, 128 0°, 0%, 50%
black #000000 0, 0, 0 0°, 0%, 0%
red #ff0000 255, 0, 0 0°, 100%, 50%
maroon #800000 128, 0, 0 0°, 100%, 25%
fuchsia #ff00ff 255, 0, 255 300°, 100%, 50%
purple #800080 128, 0, 128 300°, 100%, 25%
lime #00ff00 0, 100, 0 120°, 100%, 50%
green #008000 0, 128, 0 120°, 100%, 25%
yellow #ffff00 255, 255, 0 60°, 100%, 50%
olive #808000 128, 128, 0 60°, 100%, 25%
aqua #00ffff 0, 255, 255 180°, 100%, 50%
teal #008080 0, 128, 128 180°, 100%, 25%
blue #0000ff 0, 0, 255 240°, 100%, 50%
navy #000080 0, 0, 128 240°, 100%, 25%

Согласно последним рекомендациям W3C, применение элементов и атрибутов HTML для указания цвета (к примеру: style="color: #0000ff;") устарело, и в качестве альтернативы предложено использовать каскадные таблицы стилей — CSS.

Имена цветов CSS, SVG.

В отличие от Html, в котором стандартными являются 16 цветов, спецификации CSS и SVG, определяют более расширенный список имен, состоящий из 147 названий. Однако, несмотря на наличие в списке сто сорока семи наименований, оригинальные значения имеют только 138, так как все серые цвета могут быть указаны как через «a», так и через «e» (grAy или grEy), а fuchsia и aqua имеют альтернативные имена: magenta и cyan соответственно (последние не поддерживаются HTML 4.01).

Приведенная ниже таблица представляет имена цветов и их значения в HSL и HEX. При использовании имен, следует помнить, что синтаксис SVG отличается от HTML и CSS: атрибут fill, к примеру, применяется как к цвету текста (color), так и объекта (background-color), а stroke используются для задания контура (обводки) элемента.

ИмяR G BH S L
white #ffffffhex 0°, 0%, 100%
ivory #fffff0hex 60°, 100%, 97%
lightyellow #ffffe0hex 60°, 100%, 94%
yellow #ffff00hex 60°, 100%, 50%
snow #fffafahex 0°, 100%, 99%
floralwhite #fffaf0hex 40°, 100%, 97%
lemonchiffon #fffacdhex 54°, 100%, 90%
cornsilk #fff8dchex 48°, 100%, 93%
seashell #fff5eehex 25°, 100%, 97%
lavenderblush #fff0f5hex 340°, 100%, 97%
papayawhip #ffefd5hex 37°, 100%, 92%
blanchedalmond #ffebcdhex 36°, 100%, 90%
mistyrose #ffe4e1hex 6°, 100%, 94%
bisque #ffe4c4hex 33°, 100%, 88%
moccasin #ffe4b5hex 38°, 100%, 86%
navajowhite #ffdeadhex 36°, 100%, 84%
peachpuff #ffdab9hex 28°, 27%, 100%
gold #ffd700hex 51°, 100%, 50%
pink #ffc0cbhex 350°, 100%, 88%
lightpink #ffb6c1hex 351°, 100%, 86%
orange #ffa500hex 39°, 100%, 50%
lightsalmon #ffa07ahex 17°, 100%, 74%
darkorange #ff8c00hex 33°, 100%, 50%
coral #ff7f50hex 16°, 100%, 66%
hotpink #ff69b4hex 330°, 100%, 71%
tomato #ff6347hex 9°, 100%, 64%
orangered #ff4500hex 16°, 100%, 50%
deeppink #ff1493hex 328°, 100%, 54%
magenta, fuchsia #ff00ffhex 300°, 100%, 50%
red #ff0000hex 0°, 100%, 50%
oldlace #fdf5e6hex 39°, 85%, 95%
lightgoldenrodyellow #fafad2hex 60°, 80%, 90%
linen #faf0e6hex 30°, 67%, 94%
antiquewhite #faebd7hex 34°, 78%, 91%
salmon #fa8072hex 6°, 93%, 71%
ghostwhite #f8f8ffhex 240°, 100%, 99%
mintcream #f5fffahex 150°, 100%, 98%
whitesmoke #f5f5f5hex 0°, 0%, 96%
beige #f5f5dchex 60°, 56%, 91%
wheat #f5deb3hex 39°, 77%, 83%
sandybrown #f4a460hex 28°, 87%, 67%
azure #f0ffffhex 180°, 100%, 97%
honeydew #f0fff0hex 120°, 100%, 97%
aliceblue #f0f8ffhex 208°, 100%, 97%
khaki #f0e68chex 54°, 77%, 75%
lightcoral #f08080hex 0°, 79%, 72%
palegoldenrod #eee8aahex 55°, 67%, 80%
violet #ee82eehex 300°, 76%, 72%
darksalmon #e9967ahex 15°, 72%, 70%
lavender #e6e6fahex 240°, 67%, 94%
lightcyan #e0ffffhex 180°, 100%, 94%
burlywood #deb887hex 34°, 57%, 70%
plum #dda0ddhex 300°, 47%, 75%
gainsboro #dcdcdchex 0°, 0%, 86%
crimson #dc143chex 348°, 83%, 47%
palevioletred #db7093hex 340°, 60%, 65%
goldenrod #daa520hex 43°, 74%, 49%
orchid #da70d6hex 302°, 59%, 65%
thistle #d8bfd8hex 300°, 24%, 80%
lightgray, lightgrey #d3d3d3hex 0°, 0%, 83%
tan #d2b48chex 34°, 44%, 67%
chocolate #d2691ehex 25°, 75%, 47%
peru #cd853fhex 30°, 59%, 53%
indianred #cd5c5chex 0°, 53%, 58%
mediumvioletred #c71585hex 322°, 81%, 43%
silver #c0c0c0hex 0°, 0%, 75%
darkkhaki #bdb76bhex 56°, 38%, 58%
rosybrown #bc8f8fhex 0°, 25%, 65%
mediumorchid #ba55d3hex 288°, 59%, 58%
darkgoldenrod #b8860bhex 43°, 89%, 38%
firebrick #b22222hex 0°, 68%, 42%
powderblue #b0e0e6hex 187°, 52%, 80%
lightsteelblue #b0c4dehex 214°, 41%, 78%
paleturquoise #afeeeehex 180°, 65%, 81%
greenyellow #adff2fhex 84°, 100%, 59%
lightblue #add8e6hex 195°, 53%, 79%
darkgray, darkgrey #a9a9a9hex 0°, 0%, 66%
brown #a52a2ahex 0°, 59%, 41%
sienna #a0522dhex 19°, 56%, 40%
yellowgreen #9acd32hex 80°, 61%, 50%
darkorchid #9932cchex 280°, 61%, 50%
palegreen #98fb98hex 120°, 93%, 79%
darkviolet #9400d3hex 282°, 100%, 41%
mediumpurple #9370dbhex 260°, 60%, 65%
lightgreen #90ee90hex 120°, 73%, 75%
darkseagreen #8fbc8fhex 120°, 25%, 65%
saddlebrown #8b4513hex 25°, 76%, 31%
darkmagenta #8b008bhex 300°, 100%, 27%
darkred #8b0000hex 0°, 100%, 27%
blueviolet #8a2be2hex 271°, 76%, 53%
lightskyblue #87cefahex 203°, 92%, 76%
skyblue #87ceebhex 197°, 71%, 73%
gray, grey #808080hex 0°, 0%, 50%
olive #808000hex 60°, 100%, 25%
purple #800080hex 300°, 100%, 25%
maroon #800000hex 0°, 100%, 25%
aquamarine #7fffd4hex 160°, 100%, 75%
chartreuse #7fff00hex 90°, 100%, 50%
lawngreen #7cfc00hex 91°, 100%, 4%
mediumslateblue #7b68eehex 249°, 80%, 67%
lightslategray, lightslategrey #778899hex 210°, 14%, 53%
slategray или slategrey #708090hex 210°, 13%, 50%
olivedrab #6b8e23hex 80°, 61%, 35%
slateblue #6a5acdhex 248°, 54%, 58%
dimgray, dimgrey #696969hex 0°, 0%, 41%
mediumaquamarine #66cdaahex 160°, 51%, 60%
rebeccapurple #663399hex 270°, 50%, 40%
cornflowerblue #6495edhex 219°, 79%, 66%
cadetblue #5f9ea0hex 182°, 26%, 50%
darkolivegreen #556b2fhex 82°, 39%, 30%
indigo #4b0082hex 275°, 100%, 26%
mediumturquoise #48d1cchex 178°, 60%, 55%
darkslateblue #483d8bhex 249°, 39%, 39%
steelblue #4682b4hex 207°, 44%, 49%
royalblue #4169e1hex 225°, 73%, 57%
turquoise #40e0d0hex 174°, 72%, 57%
mediumseagreen #3cb371hex 147°, 50%, 47%
limegreen #32cd32hex 120°, 61%, 50%
darkslategray, darkslategrey #2f4f4fhex 180°, 25%, 25%
seagreen #2e8b57hex 147°, 50%, 36%
forestgreen #228b22hex 120°, 61%, 34%
lightseagreen #20b2aahex 177°, 70%, 41%
dodgerblue #1e90ffhex 210°, 100%, 56%
midnightblue #191970hex 240°, 64%, 27%
aqua, cyan #00ffffhex 180°, 100%, 50%
springgreen #00ff7fhex 150°, 100%, 50%
lime #00ff00hex 120°, 100%, 50%
mediumspringgreen #00fa9ahex 157°, 100%, 49%
darkturquoise #00ced1hex 181°, 100%, 41%
deepskyblue #00bfffhex 195°, 100%, 50%
darkcyan #008b8bhex 180°, 100%, 27%
teal #008080hex 180°, 100%, 25%
green #008000hex 120°, 100%, 25%
darkgreen #006400hex 120°, 100%, 20%
blue #0000ffhex 240°, 100%, 50%
mediumblue #0000cdhex 240°, 100%, 40%
darkblue #00008bhex 240°, 100%, 27%
navy #000080hex 240°, 100%, 25%
black #000000hex 0°, 0%, 0%

Для получения информации о других цветах и значениях в HEX, HEX8, RGB, RGB%, CMYK, HSL, HSV воспользуйтесь калькулятором цветов.

Цвета HTML
Цветовые модели

Таблица цветов HTML: онлайн коды в HEX, RGB, RGBA, CMYK

Цвета на веб-странице задаются тремя способами:

  • шестнадцатиричным кодом;
  • десятиричным кодом;
  • кодом, который носит название цвета.

Чаще всего используют способ шестнадцатиричного исчисления, несмотря на то, что более традиционна десятиричная система.

Шестнадцатиричный код цветов

Шестнадцатиричная система задания цветов в HTML основана, как следует из ее названия, на цифре 16. Цифры, входящие в систему, составляют от 0 до 9 и латинскими буквами обозначены числа от 10 до 15. Соответствия между числами в десятиричной и шестнадцатиричной системах приведены в справочных таблицах.

Числа больше 15 обозначаются соединением двух чисел. Например, по такой таблице можно определить соответствие числа в десятиричной системе числу в шестнадцатиричной. Так, числу 255 соответствует число FF. Для удобства определения системы в шестнадцатиричной перед числом ставится символ «решетка» #, пример #666999.

Все цвета (красный, зеленый и синий) могут принимать число вариантов от 00 до FF, что в сумме составляет 256 оттенков. А всего в модели RGB число комбинаций может быть 256 × 256 × 256 = 16.777.216

Веб-цвета

Если передача монитора установлена в 8 бит (256 цветов), то разные браузеры один и тот же цвет будут показывать по-разному. Это объясняется индивидуальной цветовой палитрой браузера, когда он не может показать цвет, которого в его палитре нет. Отсутствующий цвет заменяется сочетанием близких к нему, которые браузеры его имитируют. Для неизменности цвета во всех браузерах были введены так называемые веб-цвета, в которых каждая составляющая (красная, зеленая и синяя) имела одно из шести значений 0 (00), 51 (33), 102 (66), 153 (99), 204 (CC), 255 (FF). Общее число сочетаний цветов 6х6х6= 216 цветов.

Общая черта всех веб-цветов в том, что во всех браузерах они показаны одинаково. Сегодня, когда качество мониторов резко выросло, актуальность веб-цветов не так велика, как раньше.

Названия цветов

  • Если цвета широко используются, то вместо цифр можно пользоваться именами. Приведем основные способы представления цветов.
  • В виде #123ABC, где первые две цифры — красный; в середине две — зеленый;последние две — синий.
  • Представление цвета кратко в виде #ABC будет прочитано как #AABBCC.
  • Показ цвета ключевыми словами — green, black. Чтобы указанное ключевым слово понималось браузером, нужно, чтобы количество их было ограничено и соответствовало только небольшому набору основных цветов, общему для всех браузеров.
  • Вид RGB (*,*,*), где «*» – числа в диапазоне 0-255, которые соответствуют цветам красный, зелёный, синий
  • Вид RGBA, (*,*,*,*), здесь первые 3 «*» — составляющие цвета в диапазоне 0-255, последняя «*» — степень непрозрачности или альфа-канал, который задается дробями в интервале 0 — 1.

Таблица кодировок цветов HTML . Таблица цветов CSS.  HTML safe Color Codes. «Безопасные» цвета HTML. Палитра цветов HTML

Справочно: спецсимволы HTML

Таблица цветов HTML . Таблица цветов CSS.  HTML safe Color Codes. «Безопасные» цвета HTML. Палитра цветов HTML.

Сперва брузеры не поддерживали никаких цветов, кроме 256 «безопсных»:

Цвет: Color Шестнадцатеричный код:
Hex code
(#RRGGBB)
Десятичный код:
Decimal code
(R,G,B)
HTML/CSS
цвет
#000000 rgb(0,0,0) black — черный
#000033 rgb(0,0,51)
#000066 rgb(0,0,102)
#000099 rgb(0,0,153)
#0000CC rgb(0,0,204)
#0000FF rgb(0,0,255) blue — синий
#003300 rgb(0,51,0)
#003333 rgb(0,51,51)
#003366 rgb(0,51,102)
#003399 rgb(0,51,153)
#0033CC rgb(0,51,204)
#0033FF rgb(0,51,255)
#006600 rgb(0,102,0)
#006633 rgb(0,102,51)
#006666 rgb(0,102,102)
#006699 rgb(0,102,153)
#0066CC rgb(0,102,204)
#0066FF rgb(0,102,255)
#009900 rgb(0,153,0)
#009933 rgb(0,153,51)
#009966 rgb(0,153,102)
#009999 rgb(0,153,153)
#0099CC rgb(0,153,204)
#0099FF rgb(0,153,255)
#00CC00 rgb(0,204,0)
#00CC33 rgb(0,204,51)
#00CC66 rgb(0,204,102)
#00CC99 rgb(0,204,153)
#00CCCC rgb(0,204,204)
#00CCFF rgb(0,204,255)
#00FF00 rgb(0,255,0) lime — лайм
#00FF33 rgb(0,255,51)
#00FF66 rgb(0,255,102)
#00FF99 rgb(0,255,153)
#00FFCC rgb(0,255,204)
#00FFFF rgb(0,255,255) cyan — цвет морской волны (бирюза)
#330000 rgb(51,0,0)
#330033 rgb(51,0,51)
#330066 rgb(51,0,102)
#330099 rgb(51,0,153)
#3300CC rgb(51,0,204)
#3300FF rgb(51,0,255)
#333300 rgb(51,51,0)
#333333 rgb(51,51,51)
#333366 rgb(51,51,102)
#333399 rgb(51,51,153)
#3333CC rgb(51,51,204)
#3333FF rgb(51,51,255)
#336600 rgb(51,102,0)
#336633 rgb(51,102,51)
#336666 rgb(51,102,102)
#336699 rgb(51,102,153)
#3366CC rgb(51,102,204)
#3366FF rgb(51,102,255)
#339900 rgb(51,153,0)
#339933 rgb(51,153,51)
#339966 rgb(51,153,102)
#339999 rgb(51,153,153)
#3399CC rgb(51,153,204)
#3399FF rgb(51,153,255)
#33CC00 rgb(51,204,0)
#33CC33 rgb(51,204,51)
#33CC66 rgb(51,204,102)
#33CC99 rgb(51,204,153)
#33CCCC rgb(51,204,204)
#33CCFF rgb(51,204,255)
#33FF00 rgb(51,255,0)
#33FF33 rgb(51,255,51)
#33FF66 rgb(51,255,102)
#33FF99 rgb(51,255,153)
#33FFCC rgb(51,255,204)
#33FFFF rgb(51,255,255)
#660000 rgb(102,0,0)
#660033 rgb(102,0,51)
#660066 rgb(102,0,102)
#660099 rgb(102,0,153)
#6600CC rgb(102,0,204)
#6600FF rgb(102,0,255)
#663300 rgb(102,51,0)
#663333 rgb(102,51,51)
#663366 rgb(102,51,102)
#663399 rgb(102,51,153)
#6633CC rgb(102,51,204)
#6633FF rgb(102,51,255)
#666600 rgb(102,102,0)
#666633 rgb(102,102,51)
#666666 rgb(102,102,102)
#666699 rgb(102,102,153)
#6666CC rgb(102,102,204)
#6666FF rgb(102,102,255)
#669900 rgb(102,153,0)
#669933 rgb(102,153,51)
#669966 rgb(102,153,102)
#669999 rgb(102,153,153)
#6699CC rgb(102,153,204)
#6699FF rgb(102,153,255)
#66CC00 rgb(102,204,0)
#66CC33 rgb(102,204,51)
#66CC66 rgb(102,204,102)
#66CC99 rgb(102,204,153)
#66CCCC rgb(102,204,204)
#66CCFF rgb(102,204,255)
#66FF00 rgb(102,255,0)
#66FF33 rgb(102,255,51)
#66FF66 rgb(102,255,102)
#66FF99 rgb(102,255,153)
#66FFCC rgb(102,255,204)
#66FFFF rgb(102,255,255)
#990000 rgb(153,0,0)
#990033 rgb(153,0,51)
#990066 rgb(153,0,102)
#990099 rgb(153,0,153)
#9900CC rgb(153,0,204)
#9900FF rgb(153,0,255)
#993300 rgb(153,51,0)
#993333 rgb(153,51,51)
#993366 rgb(153,51,102)
#993399 rgb(153,51,153)
#9933CC rgb(153,51,204)
#9933FF rgb(153,51,255)
#996600 rgb(153,102,0)
#996633 rgb(153,102,51)
#996666 rgb(153,102,102)
#996699 rgb(153,102,153)
#9966CC rgb(153,102,204)
#9966FF rgb(153,102,255)
#999900 rgb(153,153,0)
#999933 rgb(153,153,51)
#999966 rgb(153,153,102)
#999999 rgb(153,153,153)
#9999CC rgb(153,153,204)
#9999FF rgb(153,153,255)
#99CC00 rgb(153,204,0)
#99CC33 rgb(153,204,51)
#99CC66 rgb(153,204,102)
#99CC99 rgb(153,204,153)
#99CCCC rgb(153,204,204)
#99CCFF rgb(153,204,255)
#99FF00 rgb(153,255,0)
#99FF33 rgb(153,255,51)
#99FF66 rgb(153,255,102)
#99FF99 rgb(153,255,153)
#99FFCC rgb(153,255,204)
#99FFFF rgb(153,255,255)
#CC0000 rgb(204,0,0)
#CC0033 rgb(204,0,51)
#CC0066 rgb(204,0,102)
#CC0099 rgb(204,0,153)
#CC00CC rgb(204,0,204)
#CC00FF rgb(204,0,255)
#CC3300 rgb(204,51,0)
#CC3333 rgb(204,51,51)
#CC3366 rgb(204,51,102)
#CC3399 rgb(204,51,153)
#CC33CC rgb(204,51,204)
#CC33FF rgb(204,51,255)
#CC6600 rgb(204,102,0)
#CC6633 rgb(204,102,51)
#CC6666 rgb(204,102,102)
#CC6699 rgb(204,102,153)
#CC66CC rgb(204,102,204)
#CC66FF rgb(204,102,255)
#CC9900 rgb(204,153,0)
#CC9933 rgb(204,153,51)
#CC9966 rgb(204,153,102)
#CC9999 rgb(204,153,153)
#CC99CC rgb(204,153,204)
#CC99FF rgb(204,153,255)
#CCCC00 rgb(204,204,0)
#CCCC33 rgb(204,204,51)
#CCCC66 rgb(204,204,102)
#CCCC99 rgb(204,204,153)
#CCCCCC rgb(204,204,204)
#CCCCFF rgb(204,204,255)
#CCFF00 rgb(204,255,0)
#CCFF33 rgb(204,255,51)
#CCFF66 rgb(204,255,102)
#CCFF99 rgb(204,255,153)
#CCFFCC rgb(204,255,204)
#CCFFFF rgb(204,255,255)
#FF0000 rgb(255,0,0) red — красный
#FF0033 rgb(255,0,51)
#FF0066 rgb(255,0,102)
#FF0099 rgb(255,0,153)
#FF00CC rgb(255,0,204)
#FF00FF rgb(255,0,255) magenta, fuchsia — пурпурный = фуксин
#FF3300 rgb(255,51,0)
#FF3333 rgb(255,51,51)
#FF3366 rgb(255,51,102)
#FF3399 rgb(255,51,153)
#FF33CC rgb(255,51,204)
#FF33FF rgb(255,51,255)
#FF6600 rgb(255,102,0)
#FF6633 rgb(255,102,51)
#FF6666 rgb(255,102,102)
#FF6699 rgb(255,102,153)
#FF66CC rgb(255,102,204)
#FF66FF rgb(255,102,255)
#FF9900 rgb(255,153,0)
#FF9933 rgb(255,153,51)
#FF9966 rgb(255,153,102)
#FF9999 rgb(255,153,153)
#FF99CC rgb(255,153,204)
#FF99FF rgb(255,153,255)
#FFCC00 rgb(255,204,0)
#FFCC33 rgb(255,204,51)
#FFCC66 rgb(255,204,102)
#FFCC99 rgb(255,204,153)
#FFCCCC rgb(255,204,204)
#FFCCFF rgb(255,204,255)
#FFFF00 rgb(255,255,0) yellow-желтый
#FFFF33 rgb(255,255,51)
#FFFF66 rgb(255,255,102)
#FFFF99 rgb(255,255,153)
#FFFFCC rgb(255,255,204)
#FFFFFF rgb(255,255,255) white-белый

Безопасные цвета HTML (safe web RGB Red-красный, Green-зеленый, и Blue-синий) цвета — это комбинация из шестнадцатеричных чисел:

  • 00 — нет цвета
  • 33
  • 66
  • 99
  • CC
  • FF- полный цвет

Число комбинаций из 6 по 3:

63 = 216 «безопасных» цветов

HTML — Цвета — CoderLessons.com

Цвета очень важны, чтобы придать вашему сайту хороший внешний вид. Вы можете указать цвета на уровне страницы, используя тег <body>, или вы можете установить цвета для отдельных тегов, используя атрибут bgcolor .

Тег <body> имеет следующие атрибуты, которые можно использовать для установки разных цветов:

  • bgcolor — устанавливает цвет фона страницы.

  • текст — устанавливает цвет для основного текста.

  • alink — устанавливает цвет для активных или выбранных ссылок.

  • ссылка — устанавливает цвет для связанного текста.

  • vlink — устанавливает цвет для посещенных ссылок, то есть для связанного текста, по которому вы уже щелкнули.

bgcolor — устанавливает цвет фона страницы.

текст — устанавливает цвет для основного текста.

alink — устанавливает цвет для активных или выбранных ссылок.

ссылка — устанавливает цвет для связанного текста.

vlink — устанавливает цвет для посещенных ссылок, то есть для связанного текста, по которому вы уже щелкнули.

Методы цветового кодирования HTML

Существует три способа настройки цвета на вашей веб-странице:

  • Названия цветов — Вы можете указать названия цветов, например, зеленый, синий или красный.

  • Шестнадцатеричные коды — шестизначный код, обозначающий количество красного, зеленого и синего цветов, составляющих цвет.

  • Цветные десятичные или процентные значения — это значение указывается с помощью свойства rgb ().

Названия цветов — Вы можете указать названия цветов, например, зеленый, синий или красный.

Шестнадцатеричные коды — шестизначный код, обозначающий количество красного, зеленого и синего цветов, составляющих цвет.

Цветные десятичные или процентные значения — это значение указывается с помощью свойства rgb ().

Теперь мы увидим эти раскраски одну за другой.

HTML Colors — Названия цветов

Вы можете указать прямое имя цвета, чтобы установить цвет текста или фона. W3C перечислил 16 основных имен цветов, которые будут проверяться с помощью валидатора HTML, но есть более 200 различных имен цветов, поддерживаемых основными браузерами.

Примечание. Проверьте полный список имен цветов HTML.

Стандарт W3C 16 цветов

Вот список имен W3C Standard 16 Colours, и их рекомендуется использовать.

черный Серый Серебряный белый
желтый Лайм вода фуксия
красный зеленый синий Пурпурный
каштановый оливковый флот чирок

пример

Вот примеры для установки фона тега HTML по имени цвета —

Live Demo

<!DOCTYPE html>
<html>

   <head>
      <title>HTML Colors by Name</title>
   </head>
	
   <body text = "blue" bgcolor = "green">
      <p>Use different color names for for body and table and see the result.</p>
      
      <table bgcolor = "black">
         <tr>
            <td>
               <font color = "white">This text will appear white on black background.</font>
            </td>
         </tr>
      </table>
   </body>
   
</html>

HTML-цвета — шестнадцатеричные коды

Шестнадцатеричное — это 6-значное представление цвета. Первые две цифры (RR) представляют значение красного цвета, следующие две — значение зеленого цвета (GG), а последние — значение синего (BB).

Шестнадцатеричное значение может быть взято из любого графического программного обеспечения, такого как Adobe Photoshop, Paintshop Pro или MS Paint.

Каждому шестнадцатеричному коду будет предшествовать знак фунта или хеша #. Ниже приведен список нескольких цветов с использованием шестнадцатеричной записи.

цвет Цвет HEX
# 000000
# FF0000
# 00FF00
# 0000FF
# FFFF00
# 00FFFF
# FF00FF
# C0C0C0
#FFFFFF

пример

Вот примеры для установки фона тега HTML по цветному коду в шестнадцатеричном формате —

Live Demo

<!DOCTYPE html>
<html>

   <head>
      <title>HTML Colors by Hex</title>
   </head>
	
   <body text = "#0000FF" bgcolor = "#00FF00">
      <p>Use different color hexa for for body and table and see the result.</p>
      
      <table bgcolor = "#000000">
         <tr>
            <td>
               <font color = "#FFFFFF">This text will appear white on black background.</font>
            </td>
         </tr>
      </table>
   </body>
   
</html>

HTML-цвета — значения RGB

Это значение цвета указывается с помощью свойства rgb () . Это свойство принимает три значения, по одному для красного, зеленого и синего. Значение может быть целым числом от 0 до 255 или в процентах.

Примечание. Все браузеры не поддерживают свойство цвета rgb (), поэтому рекомендуется его не использовать.

Примечание. Все браузеры не поддерживают свойство цвета rgb (), поэтому рекомендуется его не использовать.

Ниже приведен список, показывающий несколько цветов с использованием значений RGB.

цвет Цвет RGB
RGB (0,0,0)
RGB (255,0,0)
RGB (0,255,0)
RGB (0,0,255)
RGB (255,255,0)
RGB (0255255)
RGB (255,0,255)
RGB (192192192)
RGB (255,255,255)

пример

Вот примеры для установки фона тега HTML с помощью цветового кода с использованием значений rgb () —

Live Demo

<!DOCTYPE html>
<html>

   <head>
      <title>HTML Colors by RGB code</title>
   </head>
	
   <body text = "rgb(0,0,255)" bgcolor = "rgb(0,255,0)">
      <p>Use different color code for for body and table and see the result.</p>
      
      <table bgcolor = "rgb(0,0,0)">
         <tr>
            <td>
               <font color = "rgb(255,255,255)">This text will appear white on black background.</font>
            </td>
         </tr>
      </table>
   </body>
   
</html>

Браузер Безопасные Цвета

Вот список из 216 цветов, которые должны быть самыми безопасными и независимыми от компьютера. Эти цвета очень от гекса кода 000000 до FFFFFF, и они будут поддерживаться всеми компьютерами, имеющими 256 цветовую палитру.

HTML таблица цвета

  Таблица цветов html, она будет полезна веб-разработчикам, дизайнеру сайта, оформителям и сайтостроителю, как инструмент подсказка, чтобы постоянно не смотреть в редактор и не выбирать значение кода. Такое часто приходится, если вам надо подобрать какой-нибудь цвет, тон или гамму, чтобы ресурс смотрелся, сделать его красивым, интересным и удобен пользователям. Задать значение можно несколькими способами, именно html таблица цветов показаны (варианты, отсортированы в порядке популярности их использования):

Коды и названия цветов html (CSS и RGB)

  
По названию цвет rgb — код цвета код цвета html
snow
255 250 250 #fffafa
ghostwhite
248 248 255 #f8f8ff
whitesmoke
245 245 245 #f5f5f5
gainsboro
220 220 220 #dcdcdc
floralwhite
255 250 240 #fffaf0
oldlace
253 245 230 #fdf5e6
linen
250 240 230 #faf0e6
antiquewhite
250 235 215 #faebd7
papayawhip
255 239 213 #ffefd5
blanchedalmond
255 235 205 #ffebcd
bisque
255 228 196 #ffe4c4
peachpuff
255 218 185 #ffdab9
navajowhite
255 222 173 #ffdead
moccasin
255 228 181 #ffe4b5
cornsilk
255 248 220 #fff8dc
ivory
255 255 240 #fffff0
lemonchiffon
255 250 205 #fffacd
seashell
255 245 238 #fff5ee
honeydew
240 255 240 #f0fff0
mintcream
245 255 250 #f5fffa
azure
240 255 255 #f0ffff
aliceblue
240 248 255 #f0f8ff
lavender
230 230 250 #e6e6fa
lavenderblush
255 240 245 #fff0f5
mistyrose
255 228 225 #ffe4e1
white
255 255 255 #ffffff
black
0 0 0 #000000
darkslategray
47 79 79 #2f4f4f
dimgrey
105 105 105 #696969
slategrey
112 128 144 #708090
lightslategray
119 136 153 #778899
grey
190 190 190 #bebebe
lightgray
211 211 211 #d3d3d3
midnightblue
25 25 112 #191970
navyblue
0 0 128 #000080
cornflowerblue
100 149 237 #6495ed
darkslateblue
72 61 139 #483d8b
slateblue
106 90 205 #6a5acd
mediumslateblue
123 104 238 #7b68ee
lightslateblue
132 112 255 #8470ff
mediumblue
0 0 205 #0000cd
royalblue
65 105 225 #4169e1
blue
0 0 255 #0000ff
dodgerblue
30 144 255 #1e90ff
deepskyblue
0 191 255 #00bfff
skyblue
135 206 235 #87ceeb
lightskyblue
135 206 250 #87cefa
steelblue
70 130 180 #4682b4
lightsteelblue
176 196 222 #b0c4de
lightblue
173 216 230 #add8e6
powderblue
176 224 230 #b0e0e6
paleturquoise
175 238 238 #afeeee
darkturquoise
0 206 209 #00ced1
mediumturquoise
72 209 204 #48d1cc
turquoise
64 224 208 #40e0d0
cyan
0 255 255 #00ffff
lightcyan
224 255 255 #e0ffff
cadetblue
95 158 160 #5f9ea0
mediumaquamarine
102 205 170 #66cdaa
aquamarine
127 255 212 #7fffd4
darkgreen
0 100 0 #006400
darkolivegreen
85 107 47 #556b2f
darkseagreen
143 188 143 #8fbc8f
seagreen
46 139 87 #2e8b57
mediumseagreen
60 179 113 #3cb371
lightseagreen
32 178 170 #20b2aa
palegreen
152 251 152 #98fb98
springgreen
0 255 127 #00ff7f
lawngreen
124 252 0 #7cfc00
green
0 255 0 #00ff00
chartreuse
127 255 0 #7fff00
medspringgreen
0 250 154 #00fa9a
greenyellow
173 255 47 #adff2f
limegreen
50 205 50 #32cd32
yellowgreen
154 205 50 #9acd32
forestgreen
34 139 34 #228b22
olivedrab
107 142 35 #6b8e23
darkkhaki
189 183 107 #bdb76b
palegoldenrod
238 232 170 #eee8aa
ltgoldenrodyello
250 250 210 #fafad2
lightyellow
255 255 224 #ffffe0
yellow
255 255 0 #ffff00
gold
255 215 0 #ffd700
lightgoldenrod
238 221 130 #eedd82
goldenrod
218 165 32 #daa520
darkgoldenrod
184 134 11 #b8860b
rosybrown
188 143 143 #bc8f8f
indianred
205 92 92 #cd5c5c
saddlebrown
139 69 19 #8b4513
sienna
160 82 45 #a0522d
peru
205 133 63 #cd853f
burlywood
222 184 135 #deb887
beige
245 245 220 #f5f5dc
wheat
245 222 179 #f5deb3
sandybrown
244 164 96 #f4a460
tan
210 180 140 #d2b48c
chocolate
210 105 30 #d2691e
firebrick
178 34 34 #b22222
brown
165 42 42 #a52a2a
darksalmon
233 150 122 #e9967a
salmon
250 128 114 #fa8072
lightsalmon
255 160 122 #ffa07a
orange
255 165 0 #ffa500
darkorange
255 140 0 #ff8c00
coral
255 127 80 #ff7f50
lightcoral
240 128 128 #f08080
tomato
255 99 71 #ff6347
orangered
255 69 0 #ff4500
red
255 0 0 #ff0000
hotpink
255 105 180 #ff69b4
deeppink
255 20 147 #ff1493
pink
255 192 203 #ffc0cb
lightpink
255 182 193 #ffb6c1
palevioletred
219 112 147 #db7093
maroon
176 48 96 #b03060
mediumvioletred
199 21 133 #c71585
violetred
208 32 144 #d02090
magenta
255 0 255 #ff00ff
violet
238 130 238 #ee82ee
plum
221 160 221 #dda0dd
orchid
218 112 214 #da70d6
mediumorchid
186 85 211 #ba55d3
darkorchid
153 50 204 #9932cc
darkviolet
148 0 211 #9400d3
blueviolet
138 43 226 #8a2be2
purple
160 32 240 #a020f0
mediumpurple
147 112 219 #9370db
thistle
216 191 216 #d8bfd8
snow1
255 250 250 #fffafa
snow2
238 233 233 #eee9e9
snow3
205 201 201 #cdc9c9
snow4
139 137 137 #8b8989
seashell1
255 245 238 #fff5ee
seashell2
238 229 222 #eee5de
seashell3
205 197 191 #cdc5bf
seashell4
139 134 130 #8b8682
antiquewhite1
255 239 219 #ffefdb
antiquewhite2
238 223 204 #eedfcc
antiquewhite3
205 192 176 #cdc0b0
antiquewhite4
139 131 120 #8b8378
bisque1
255 228 196 #ffe4c4
bisque2
238 213 183 #eed5b7
bisque3
205 183 158 #cdb79e
bisque4
139 125 107 #8b7d6b
peachpuff1
255 218 185 #ffdab9
peachpuff2
238 203 173 #eecbad
peachpuff3
205 175 149 #cdaf95
peachpuff4
139 119 101 #8b7765
navajowhite1
255 222 173 #ffdead
navajowhite2
238 207 161 #eecfa1
navajowhite3
205 179 139 #cdb38b
navajowhite4
139 121 94 #8b795e
lemonchiffon1
255 250 205 #fffacd
lemonchiffon2
238 233 191 #eee9bf
lemonchiffon3
205 201 165 #cdc9a5
lemonchiffon4
139 137 112 #8b8970
cornsilk1
255 248 220 #fff8dc
cornsilk2
238 232 205 #eee8cd
cornsilk3
205 200 177 #cdc8b1
cornsilk4
139 136 120 #8b8878
ivory1
255 255 240 #fffff0
ivory2
238 238 224 #eeeee0
ivory3
205 205 193 #cdcdc1
ivory4
139 139 131 #8b8b83
honeydew1
240 255 240 #f0fff0
honeydew2
224 238 224 #e0eee0
honeydew3
193 205 193 #c1cdc1
honeydew4
131 139 131 #838b83
lavenderblush2
255 240 245 #fff0f5
lavenderblush3
238 224 229 #eee0e5
lavenderblush4
205 193 197 #cdc1c5
lavenderblush5
139 131 134 #8b8386
mistyrose1
255 228 225 #ffe4e1
mistyrose2
238 213 210 #eed5d2
mistyrose3
205 183 181 #cdb7b5
mistyrose4
139 125 123 #8b7d7b
azure1
240 255 255 #f0ffff
azure2
224 238 238 #e0eeee
azure3
193 205 205 #c1cdcd
azure4
131 139 139 #838b8b
slateblue1
131 111 255 #836fff
slateblue2
122 103 238 #7a67ee
slateblue3
105 89 205 #6959cd
slateblue4
71 60 139 #473c8b
royalblue1
72 118 255 #4876ff
royalblue2
67 110 238 #436eee
royalblue3
58 95 205 #3a5fcd
royalblue4
39 64 139 #27408b
blue1
0 0 255 #0000ff
blue2
0 0 238 #0000ee
blue3
0 0 205 #0000cd
blue4
0 0 139 #00008b
dodgerblue1
30 144 255 #1e90ff
dodgerblue2
28 134 238 #1c86ee
dodgerblue3
24 116 205 #1874cd
dodgerblue4
16 78 139 #104e8b
steelblue1
99 184 255 #63b8ff
steelblue2
92 172 238 #5cacee
steelblue3
79 148 205 #4f94cd
steelblue4
54 100 139 #36648b
deepskyblue1
0 191 255 #00bfff
deepskyblue2
0 178 238 #00b2ee
deepskyblue3
0 154 205 #009acd
deepskyblue4
0 104 139 #00688b
skyblue1
135 206 255 #87ceff
skyblue2
126 192 238 #7ec0ee
skyblue3
108 166 205 #6ca6cd
skyblue4
74 112 139 #4a708b
lightskyblue1
176 226 255 #b0e2ff
lightskyblue2
164 211 238 #a4d3ee
lightskyblue3
141 182 205 #8db6cd
lightskyblue4
96 123 139 #607b8b
slategray1
198 226 255 #c6e2ff
slategray2
185 211 238 #b9d3ee
slategray3
159 182 205 #9fb6cd
slategray4
108 123 139 #6c7b8b
lightsteelblue1
202 225 255 #cae1ff
lightsteelblue2
188 210 238 #bcd2ee
lightsteelblue3
162 181 205 #a2b5cd
lightsteelblue4
110 123 139 #6e7b8b
lightblue1
191 239 255 #bfefff
lightblue2
178 223 238 #b2dfee
lightblue3
154 192 205 #9ac0cd
lightblue4
104 131 139 #68838b
lightcyan1
224 255 255 #e0ffff
lightcyan2
209 238 238 #d1eeee
lightcyan3
180 205 205 #b4cdcd
lightcyan4
122 139 139 #7a8b8b
paleturquoise1
187 255 255 #bbffff
paleturquoise2
174 238 238 #aeeeee
paleturquoise3
150 205 205 #96cdcd
paleturquoise4
102 139 139 #668b8b
cadetblue1
152 245 255 #98f5ff
cadetblue2
142 229 238 #8ee5ee
cadetblue3
122 197 205 #7ac5cd
cadetblue4
83 134 139 #53868b
turquoise1
0 245 255 #00f5ff
turquoise2
0 229 238 #00e5ee
turquoise3
0 197 205 #00c5cd
turquoise4
0 134 139 #00868b
cyan1
0 255 255 #00ffff
cyan2
0 238 238 #00eeee
cyan3
0 205 205 #00cdcd
cyan4
0 139 139 #008b8b
darkslategray1
151 255 255 #97ffff
darkslategray2
141 238 238 #8deeee
darkslategray3
121 205 205 #79cdcd
darkslategray4
82 139 139 #528b8b
aquamarine1
127 255 212 #7fffd4
aquamarine2
118 238 198 #76eec6
aquamarine3
102 205 170 #66cdaa
aquamarine4
69 139 116 #458b74
darkseagreen1
193 255 193 #c1ffc1
darkseagreen2
180 238 180 #b4eeb4
darkseagreen3
155 205 155 #9bcd9b
darkseagreen4
105 139 105 #698b69
seagreen1
84 255 159 #54ff9f
seagreen2
78 238 148 #4eee94
seagreen3
67 205 128 #43cd80
seagreen4
46 139 87 #2e8b57
palegreen1
154 255 154 #9aff9a
palegreen2
144 238 144 #90ee90
palegreen3
124 205 124 #7ccd7c
palegreen4
84 139 84 #548b54
springgreen1
0 255 127 #00ff7f
springgreen2
0 238 118 #00ee76
springgreen3
0 205 102 #00cd66
springgreen4
0 139 69 #008b45
green1
0 255 0 #00ff00
green2
0 238 0 #00ee00
green3
0 205 0 #00cd00
green4
0 139 0 #008b00
chartreuse1
127 255 0 #7fff00
chartreuse2
118 238 0 #76ee00
chartreuse3
102 205 0 #66cd00
chartreuse4
69 139 0 #458b00
olivedrab1
192 255 62 #c0ff3e
olivedrab2
179 238 58 #b3ee3a
olivedrab3
154 205 50 #9acd32
olivedrab4
105 139 34 #698b22
darkolivegreen1
202 255 112 #caff70
darkolivegreen2
188 238 104 #bcee68
darkolivegreen3
162 205 90 #a2cd5a
darkolivegreen4
110 139 61 #6e8b3d
khaki1
255 246 143 #fff68f
khaki2
238 230 133 #eee685
khaki3
205 198 115 #cdc673
khaki4
139 134 78 #8b864e
lightgoldenrod1
255 236 139 #ffec8b
lightgoldenrod2
238 220 130 #eedc82
lightgoldenrod3
205 190 112 #cdbe70
lightgoldenrod4
139 129 76 #8b814c
lightyellow1
255 255 224 #ffffe0
lightyellow2
238 238 209 #eeeed1
lightyellow3
205 205 180 #cdcdb4
lightyellow4
139 139 122 #8b8b7a
yellow1
255 255 0 #ffff00
yellow2
238 238 0 #eeee00
yellow3
205 205 0 #cdcd00
yellow4
139 139 0 #8b8b00
gold1
255 215 0 #ffd700
gold2
238 201 0 #eec900
gold3
205 173 0 #cdad00
gold4
139 117 0 #8b7500
goldenrod1
255 193 37 #ffc125
goldenrod2
238 180 34 #eeb422
goldenrod3
205 155 29 #cd9b1d
goldenrod4
139 105 20 #8b6914
darkgoldenrod1
255 185 15 #ffb90f
darkgoldenrod2
238 173 14 #eead0e
darkgoldenrod3
205 149 12 #cd950c
darkgoldenrod4
139 101 8 #8b658b
rosybrown1
255 193 193 #ffc1c1
rosybrown2
238 180 180 #eeb4b4
rosybrown3
205 155 155 #cd9b9b
rosybrown4
139 105 105 #8b6969
indianred1
255 106 106 #ff6a6a
indianred2
238 99 99 #ee6363
indianred3
205 85 85 #cd5555
indianred4
139 58 58 #8b3a3a
sienna1
255 130 71 #ff8247
sienna2
238 121 66 #ee7942
sienna3
205 104 57 #cd6839
sienna4
139 71 38 #8b4726
burlywood1
255 211 155 #ffd39b
burlywood2
238 197 145 #eec591
burlywood3
205 170 125 #cdaa7d
burlywood4
139 115 85 #8b7355
wheat1
255 231 186 #ffe7ba
wheat2
238 216 174 #eed8ae
wheat3
205 186 150 #cdba96
wheat4
139 126 102 #8b7e66
tan1
255 165 79 #ffa54f
tan2
238 154 73 #ee9a49
tan3
205 133 63 #cd853f
tan4
139 90 43 #8b5a2b
chocolate1
255 127 36 #ff7f24
chocolate2
238 118 33 #ee7621
chocolate3
205 102 29 #cd661d
chocolate4
139 69 19 #8b4513
firebrick1
255 48 48 #ff3030
firebrick2
238 44 44 #ee2c2c
firebrick3
205 38 38 #cd2626
firebrick4
139 26 26 #8b1a1a
brown1
255 64 64 #ff4040
brown2
238 59 59 #ee3b3b
brown3
205 51 51 #cd3333
brown4
139 35 35 #8b2323
salmon1
255 140 105 #ff8c69
salmon2
238 130 98 #ee8262
salmon3
205 112 84 #cd7054
salmon4
139 76 57 #8b4c39
lightsalmon1
255 160 122 #ffa07a
lightsalmon2
238 149 114 #ee9572
lightsalmon3
205 129 98 #cd8162
lightsalmon4
139 87 66 #8b5742
orange1
255 165 0 #ffa500
orange2
238 154 0 #ee9a00
orange3
205 133 0 #cd8500
orange4
139 90 0 #8b5a00
darkorange1
255 127 0 #ff7f00
darkorange2
238 118 0 #ee7600
darkorange3
205 102 0 #cd6600
darkorange4
139 69 0 #8b4500
coral1
255 114 86 #ff7256
coral2
238 106 80 #ee6a50
coral3
205 91 69 #cd5b45
coral4
139 62 47 #8b3e2f
tomato1
255 99 71 #ff6347
tomato2
238 92 66 #ee5c42
tomato3
205 79 57 #cd4f39
tomato4
139 54 38 #8b3626
orangered1
255 69 0 #ff4500
orangered2
238 64 0 #ee4000
orangered3
205 55 0 #cd3700
orangered4
139 37 0 #8b2500
red1
255 0 0 #ff0000
red2
238 0 0 #ee0000
red3
205 0 0 #cd0000
red4
139 0 0 #8b0000
deeppink1
255 20 147 #ff1493
deeppink2
238 18 137 #ee1289
deeppink3
205 16 118 #cd1076
deeppink4
139 10 80 #8b0a50
hotpink1
255 110 180 #ff6eb4
hotpink2
238 106 167 #ee6aa7
hotpink3
205 96 144 #cd6090
hotpink4
139 58 98 #8b3a62
pink1
255 181 197 #ffb5c5
pink2
238 169 184 #eea9b8
pink3
205 145 158 #cd919e
pink4
139 99 108 #8b636c
lightpink1
255 174 185 #ffaeb9
lightpink2
238 162 173 #eea2ad
lightpink3
205 140 149 #cd8c95
lightpink4
139 95 101 #8b5f65
palevioletred1
255 130 171 #ff82ab
palevioletred2
238 121 159 #ee799f
palevioletred3
205 104 137 #cd6889
palevioletred4
139 71 93 #8b475d
maroon1
255 52 179 #ff34b3
maroon2
238 48 167 #ee30a7
maroon3
205 41 144 #cd2990
maroon4
139 28 98 #8b1c62
violetred1
255 62 150 #ff3e96
violetred2
238 58 140 #ee3a8c
violetred3
205 50 120 #cd3278
violetred4
139 34 82 #8b2252
magenta1
255 0 255 #ff00ff
magenta2
238 0 238 #ee00ee
magenta3
205 0 205 #cd00cd
magenta4
139 0 139 #8b008b
orchid1
255 131 250 #ff83fa
orchid2
238 122 233 #ee7ae9
orchid3
205 105 201 #cd69c9
orchid4
139 71 137 #8b4789
plum1
255 187 255 #ffbbff
plum2
238 174 238 #eeaeee
plum3
205 150 205 #cd96cd
plum4
139 102 139 #8b668b
mediumorchid1
224 102 255 #e066ff
mediumorchid2
209 95 238 #d15fee
mediumorchid3
180 82 205 #b452cd
mediumorchid4
122 55 139 #7a378b
darkorchid1
191 62 255 #bf3eff
darkorchid2
178 58 238 #b23aee
darkorchid3
154 50 205 #9a32cd
darkorchid4
104 34 139 #68228b
purple1
155 48 255 #9b30ff
purple2
145 44 238 #912cee
purple3
125 38 205 #7d26cd
purple4
85 26 139 #551a8b
mediumpurple1
171 130 255 #ab82ff
mediumpurple2
159 121 238 #9f79ee
mediumpurple3
137 104 205 #8968cd
mediumpurple4
93 71 139 #5d478b
thistle1
255 225 255 #ffe1ff
thistle2
238 210 238 #eed2ee
thistle3
205 181 205 #cdb5cd
thistle4
139 123 139 #8b7b8b
grey11
28 28 28 #1c1c1c
grey21
54 54 54 #363636
grey31
79 79 79 #4f4f4f
grey41
105 105 105 #696969
grey51
130 130 130 #828282
grey61
156 156 156 #9c9c9c
grey71
181 181 181 #b5b5b5
gray81
207 207 207 #cfcfcf
gray91
232 232 232 #e8e8e8
darkgrey
169 169 169 #a9a9a9
darkblue
0 0 139 #00008b
darkcyan
0 139 139 #008b8b
darkmagenta
139 0 139 #8b008b
darkred
139 0 0 #8b0000
lightgreen
144 238 144 #90ee90

Как самостоятельно задать цвет в CSS, задать код, вот несколько вариант:

1. Задать хтмл цвет методом шести цифр шестнадцатеричного кода

В начале, обязательно пишется символ решётка, пример этого варианта: #XXXXXX. Две цифры впереди отвечают за силу и глубину красного оттенка (Red), две следующие цифры зеленый (Green) и оставшиеся две цифры отвечает за синий цвет (Blue). Из букв получаем модель RGB цветосочетания или (rgb таблица). Метод применяется чаще всего для решения задач, чтобы качественно оформить страницы сайта, упростить работу вебмастеру, список кодов замечательно позволяет точно подобрать подходящий оттенок цвета. 
Примечание Существует более краткая форма обозначения цвета html в виде трех шестнадцатеричных цифры: #XXX. В этом случаи каждый код определяется двухзначным шестнадцатеричным числом, поэтому каждая цифра дублируется. К примеру, #ABC соответствует коду #AABBCC. Также и с цифрами.

2. Задать цвет можно с помощью слов, через его название

Удобный и понятный вариант, вместо цифр по его названию, пишите слово (Red) и получаете красный цвет. Но есть ограничение, малое количество вариантов, которые можно задать по названию, поэтому получает применять только в некоторых случая. И всё же название цвета достаточно во многих ситуациях, чтобы можно было работать с ними, подобрать подходящий для себя соответствующий, хотя бы на время.

3. Задание цвета методом трех десятичных чисел

Похожий метод на первый вариант, но с более сложным синтаксисом: rgb(XYZ,XYZ,XYZ), где X, Y, Z — любые десятичные цифры, но XYZ не должны быть больше значения 255. Каждый из трех чисел отделенные запятой отвечают за какой-то цвет (красный, зелёный, синий).
Сама таблица цветов html представлен здесь на dle9.com ниже, наглядный пример состоит из трёх вариантов с обозначением в формате цифр, RGB-модели, и названия html и код.

Добавьте эту страницу в закладки браузера, чтобы всегда была «под рукой».

Для добавления в закладки нажмите Ctrl+D.

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

Смотрите также:

Рекомендуем интересные темы

140 цветов HTML с кодами HEX, RGB и именами

Используя цветовой код RGB или HEX в HTML, вы можете изменить цвет текста, фона, URL-адреса, шрифта, таблицы или всей страницы.

Цвета в HTML #

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

  • по названию цвета, например, красный , зеленый , синий
  • шестнадцатеричным числом : от # 000000 до #ffffff
  • по цветовому коду в палитре RGB: от rgb (0, 0, 0) до rgb (255, 255, 255)

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

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

Цветовые коды HEX в HTML #

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

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

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

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

— Тогда для зеленого будет шестнадцатеричный код: # 00FF00

Палитра цветов HTML HTML #

В палитре RGB цвета смешиваются аналогичным образом, смешивая интенсивность красного и зеленого , и синие цвета. Отсюда и сокращение RGB. Здесь только интенсивность устанавливается числами 0 из 255, где 0 — самая низкая интенсивность, 255 — самая высокая. Например, зеленый цвет будет выглядеть так: rgb (0, 255, 0) ;

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

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

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

малиновый малиновый 9 0101 помидор # FFA07A 9010,1601 901 01 # FF8C00 01 # 01 # 0)
    1 # DAA520
темно-оливково-зеленый 173,255,47) 9 0097 9010EE светло-зеленый 9010EE 1 9008 90 097
синий сталь сталь # 4682B4 темно-синий голубой небосклон
    2 небосклон
      2 небосклон
900 86 темно-синий 9010 0000101 средний синий
    2
синий сланец
    2
синий сланец # 6A5ACD EE 255,105,180)
    2
      2
    2
сиенна , 45) 9010Jo86 белый 9010,245,230 ) 900 97 бледно-лиловый 9010,250240 ivory409 50,250 # 000000
    2 255,255,255)
Цвет Имя HTML-код строки HEX-код Код RGB
бордовый бордовый # 800000 (128,0,0)
темно-красный темно-красный # 8B0000 (139,0,0)
коричневый коричневый # A52A2A (165,42,42)
огнеупорный кирпич огнеупорный кирпич # B22222 (178,34,34)
# DC143C (220,20,60)
красный красный # FF0000 (255,0,0)
помидор # FF6347 (255,99,71)
коралл коралл # FF7F50 (255,127,80)
индийский красный CD5C5C (205,92,92)
светло-коралловый светло-коралловый # F08080 (240,128,128)
темно-лососевый темно-лососевый темно-лососевый темно-лососевый темный
лосось лосось # FA8072 (250,128,114)
светлый лосось светлый лосось красный # FF4500 (255,69,0)
темно-оранжевый темно-оранжевый (255,140,0)
оранжевый оранжевый # FFA500 (255,165,0)
золото золото
золото
темно-золотой стержень темно-золотой стержень # B8860B (184,134,11)
золотой стержень золотой стержень палочка бледно-золотая palegoldenrod # EEE8AA (238,232,170)
темно-хаки темнохаки # BDB7610 # BDB76B # BDB76B # F0E68C (240,230,140)
оливковое оливковое # 808000 (128,128,0 )
желтый желтый # FFFF00 (255,255,0)
желто-зеленый желто-зеленый # 9ACD32 темно-оливковый # 556B2F (85,107,47)
оливковый оливковый # 6B8E23 (107,142,35) зеленый (107,142,35) зеленый # 7CFC00 (124,252,0)
шартрез шартрез # 7FFF00 (127,255,0)
FF зеленый желтый FF зеленый желтый
темно-зеленый темно-зеленый # 006400 (0,100,0)
зеленый зеленый # 008000 (0,128,0)
лесной зеленый лесной зеленый # 228B22 (34,139 лайм # 00FF00 (0,255,0)
салатовый салатовый # 32CD32 (50,205,50)
(144,238,144)
бледно-зеленый бледно-зеленый # 98FB98 (152,251,152)
темно-зеленый цвет моря 9010,1978 средний весенний зеленый средний весенний зеленый # 00FA9A (0,250,154)
весенне-зеленый весенне-зеленый # 00FF7F (0,255,127)
морской зеленый морской зеленый # 2E8B57
    2
цвет морской волны # 66CDAA (102,205,170)
средний морской зеленый средний морской зеленый # 3CB371 (60,179,113)
светло-зеленый )
темно-сланцево-серый темно-серый # 2F4F4F (47,79,79)
бирюзовый бирюзовый ,128 # 0010802 темно-голубой темно-голубой # 008B8B (0,139,139)
голубой голубой # 00FFFF (0,255,255)
голубой голубой # 00FFFF голубой голубой # E0FFFF (224,255,255)
тёмно-бирюзовый тёмно-бирюзовый # 00CED1 (0,206,209)
бирюзовый средне-бирюзовый средний бирюзовый # 48D1CC (72,209,204)
бледно-бирюзовый paleturquoise #AFEEEE
    2
бирюзовый морской воды акв. (127,255,212)
синий порошковый синий порошковый # B0E0E6 (176,224,230)
синий кадет синий кадет # 5F9EA0 9010,12 синий (70,130,180)
васильковый васильковый # 6495ED (100,149,237)
темно-синий deeps
dodger blue dodgerblue # 1E90FF (30,144,255)
голубой голубой # ADD8E6 голубой # 87CEEB (135,206,235)
светло-голубой светло-голубой # 87CEFA (135,206,250)
полуночно-синий полуночно-синий # 1 # 000080 (0,0,128)
темно-синий темно-синий # 00008B (0,0,139)
средне-синий синий (0,0,205)
синий синий # 0000FF (0,0,255)
королевский синий royalblue # 4169E1 сине-фиолетовый сине-фиолетовый # 8A2BE2 (138,43,226)
индиго 901 02 индиго # 4B0082 (75,0,130)
темно-синий сланец темно-синий # 483D8B (72,61,139)
(106,90,205)
средний сланцевый синий средний голубой # 7B68EE (123,104,238)
средний фиолетовый средний фиолетовый
темно-пурпурный темно-пурпурный # 8B008B (139,0,139)
темно-фиолетовый темно-фиолетовый темная орхидея темная орхидея # 9932CC (153,50,204)
средняя орхидея средняя орхидея # BA55D3 (186,85,211)
фиолетовый фиолетовый # 800080 (128,0,128)
9010 D8BFD8 (216,191,216)
слива слива # DDA0DD (221,160,221)
фиолетовый фиолетовый фуксия фуксия # FF00FF (255,0,255)
орхидея орхидея # DA70D6 (218,112,214) красная красная красная (199,21,133)
бледно-фиолетовый красный paleviol etred # DB7093 (219,112,147)
темно-розовый deeppink # FF1493 (255,20,147)
ярко-розовый горячий розовый
светло-розовый светло-розовый # FFB6C1 (255,182,193)
розовый розовый антикв-белый # FAEBD7 (250,235,215)
бежевый бежевый # F5F5DC (245,245,220) бисквитный бисквитный
бланшированный миндаль бланшированный миндаль #FFEBCD (255,235,205)
пшеница пшеница # F5DEB3 (245,222,179)
кукурузный шелк корнсилк
    2 F102 лимонный шифон
лимонный шифон #FFFACD (255,250,205)
светло-золотистый желтый стержень светло-золотистый желтый # FAFAD2 9010 желтый 9010 желтый FFFFE0 (255,255,224)
седло-коричневый седло-коричневый # 8B4513 (139,69,19)
сиенна
шоколад шоколад # D2691E (210,105,30)
peru peru # CD853F (205,133,63)
песочно-коричневый сэндибраун 96)
массивное дерево бурливуд # DEB887 (222,184,135)
желто-коричневый коричневый # D2B48C
    2
коричневый розово-коричневый # BC8F8F (188,143,143)
мокасины мокасины # FFE4B5 (255,228,181) 9010,29101
слойка персик слойка персик # FFDAB9 (255,218,18 5)
роза туманная роза туманная # FFE4E1 (255,228,225)
румяна лавандовые румяна лаванды
    2
белье # FAF0E6 (250,240,230)
старое кружево oldlace # FDF5E6 (253,245,230)
морская ракушка морская ракушка # FFF5EE (255,245,238)
мятный крем мятный крем # F5FF10 # F5FFFA серый # 708090 (112,128,144)
светло-серый светло-серый # 778899 (119,136,153)
светло-стальной синий светло-синий # B010,286101 # E6E6FA (230,230,250)
цветочный белый цветочный белый # FFFAF0 (255,250,240)
белый привидение белый призрак # F8F8FF (248,248,255)
медовая роса медовая роса # FFFFF0 (255,255,240) 9010 2
лазурный лазурный # F0FFFF (240,255,255)
снег снег #FFFAFA черный (0,0,0)
тусклый серый тусклый серый # 696969 (105,105,105)
серый серый 80102 #
темно-серый / темно-серый темно-серый # A9A9A9 (169,169,169)
серебристый серебристый # C092,1992 # C0C09109 серый / светло-серый светло-серый # D3D3D3 (211,211,211)
усиление сборо gainsboro #DCDCDC (220,220,220)
белый дым белый дым # F5F5F5

Подробнее об HTML-руководствах или изучите Full-Stack JS с нуля!

цветов | HTML Dog

Следующие значения, чтобы указать полный как красный-как-красный-может-быть, все дают один и тот же результат:

  • красный
  • RGB (255,0,0)
  • RGB (100%, 0%, 0%)
  • # ff0000
  • # f00

Предопределенные названия цветов включают аква , черный , синий , фуксия , серый , зеленый , салатовый , бордовый , темно-синий , оливковый красный , серебристый , бирюзовый , белый и желтый . прозрачный также является допустимым значением.

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

Три значения в значении RGB: от 0 до 255, 0 - самый низкий уровень (например, без красного), 255 - самый высокий уровень (например, полный красный). Эти значения также могут быть в процентах.

Шестнадцатеричная система (ранее и более точно известная как « шестнадцатеричная ») - это система счисления по основанию 16 и .Обычно мы используем десятичную систему счисления и ( с основанием 10, , от 0 до 9), но шестнадцатеричная имеет 16 цифр, от 0 до f.

Шестнадцатеричное число предваряется символом решетки ( # ) и может состоять из трех или шести цифр. По сути, трехзначная версия является сжатой версией шестизначной ( # ff0000 становится # f00 , # cc9966 становится # c96 и т. Д.). Трехзначную версию легче расшифровать (первая цифра, как и первое значение в RGB, красная, вторая зеленая и третья синяя), но шестизначная версия дает вам больше контроля над точным цветом.

CSS3, последняя версия CSS, также позволяет определять HSL цвета - оттенок, насыщенность и яркость. Подробнее об этом, а также о полупрозрачных цветах можно найти в Расширенном руководстве по CSS.

Рекламируйте здесь! На давнем, начитанном и уважаемом ресурсе веб-разработки.

цвет и цвет фона

Цвета могут быть применены с использованием color и background-color (обратите внимание, что это должен быть «цвет» американского английского языка, а не «цвет»).

Синий фон и желтый текст могут выглядеть так:

 
h2 {
  цвет: желтый; 
  цвет фона: синий; 
}
  

Эти цвета могут быть слишком резкими, поэтому вы можете изменить код своего файла CSS для немного других оттенков:

 
тело {
    размер шрифта: 14 пикселей;
    цвет: темно-синий;
}

h2 {
  цвет: #ffc; 
  цвет фона: # 009; 
}
  

Сохраните файл CSS и обновите страницу в браузере.Вы увидите, что цвета первого заголовка (элемент h2 ) изменились на желтый и синий.

Вы можете применить свойства color и background-color к большинству HTML-элементов, включая body , который изменит цвета страницы и всего на ней.

50 оттенков серого темного режима

Погрузитесь в палитры темного режима Spotify, Twitter и Facebook, проанализировав шестнадцатеричные коды

Если вы, как я, заядлый пользователь темного режима, то знаете, что темный режим - это не только белый текст на черном фоне.В одном приложении несколько оттенков серого придают ему некоторую глубину. А в различных приложениях спектр серого становится еще шире.

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

Цветовое пространство RGB

RGB

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

Цветовое пространство RGB - одна из самых популярных моделей.Каждый цвет представляет собой совокупный вес трех цветов: красного, зеленого и синего. Вес варьируется от 0 (минимум) до 255 (максимум) и обычно отображается тройкой: (красный вес, зеленый вес, синий вес) . Например, красный будет (255, 0, 0) , поскольку чистый красный не имеет следов зеленого или синего. Глубокий пурпурный баклажан - это (128, 0, 128) с равными частями красного и синего. У нас также есть черный, которому не хватает цвета: (0, 0, 0) и белый, все цвета: (255, 255, 255).

Мы также можем визуализировать цветовое пространство RGB в виде куба с осью красного, зеленого и синего цветов. В этом кубе можно «нанести» любой цвет.

Нас интересуют цвета вдоль и вокруг линии оттенков серого . В этом кубе RGB линия оттенков серого простирается от черного к белому. Каждый цвет в этой строке имеет одинаковое значение для красного, зеленого и синего. Например, средний серый - (127, 127, 127), и является средней точкой линии градаций серого. Чем ближе значения к 0, тем темнее оттенок серого, поскольку черный - (0, 0, 0) .

Линия оттенков серого от черного к белому

Цвета, окружающие линию градаций серого, не являются чисто серыми, а имеют слегка оттенки. Например, Twitter использует (25, 39, 52) . Обратите внимание на то, что, хотя значения близки друг к другу, синее значение является самым большим. Таким образом, этот оттенок серого немного синеватый.

Шестнадцатеричные коды

Для оцифровки этого триплета RGB у нас есть цветовые коды HTML (Hex). HTML, CSS, SVG и другие используют шестнадцатеричные коды для представления цветов.Название происходит от того, что шестнадцатеричные коды представляют собой просто конкатенацию значений RGB в шестнадцатеричном формате в десятичном виде. Иногда перед шестнадцатеричным кодом ставится знак фунта. Если преобразовать вышеупомянутые цвета в Hex, мы получим:

  • Красный: (255, 0, 0) → # ff0000
  • Баклажан фиолетовый: (128, 0, 128) → # 800080
  • Черный: (0, 0, 0) → # 000000
  • Средне-серый: (127, 127, 127) → # 7f7f7f
  • Белый: (255, 255, 255) → #ffffff
  • Twitter сине-серый: (25, 39, 52) → # 1

Теперь, когда мы немного знаем о представлениях RGB и Hex, мы можем исследовать мир темного режима.

Анатомия приложения темного режима

Анализируя различные приложения и сайты, я заметил некоторые общие закономерности, которым следуют большинство приложений в темном режиме:

Фон

Как самый доминирующий цвет, фон почти всегда самый темный. Это никогда не бывает чисто черным - обычно на пару оттенков светлее.

Их можно найти сбоку (обычно слева) или вверху приложения. Строки меню помогают в навигации по приложению и светлее, чем цвет фона.

Карточка

С появлением материального дизайна появилась концепция карточек. Эти элементы разделяют контент сайта и также имеют более светлый серый цвет.

Разделитель

На некоторых картах есть разделители для разделения содержимого. Разделители еще легче.

Кнопка

Кнопки вызывают действия и могут быть серыми или выделенными цветом приложения.

Основной текст

Заголовки и заголовки. Первичный текст - самый светлый цвет на сайте, обычно очень близкий к белому.

Дополнительный текст

Дополнительные тексты меньше по размеру шрифта и немного темнее, чем их основные аналоги.

Значок

Представляя идеи без слов, значки также светлые и иногда сопровождаются второстепенным текстом.

Это некоторые характеристики, которые разделяют многие современные приложения в темном режиме! Теперь посмотрим, как эти элементы применимы к популярным приложениям.

Spotify (приложение для macOS)

Слева направо : фон, строка меню, верхний градиент, нижний градиент, основной текст, дополнительный текст

Spotify - самое раннее приложение, которое я помню, что только имел темный режим.Все началось не так. После кардинального редизайна в 2014 году стриминговый сервис заставил всех своих пользователей использовать темную тему. Аргумент в пользу перехода был таким: темный фон позволяет красочным обложкам альбомов появляться, как в театрах, приглушающих свет для шоу.

Действительно, красочные обложки альбомов контрастируют с темным приложением и заставляют их казаться ярче, чем на белом фоне:

Яркие цвета pop

Spotify - также единственное приложение, которое я заметил, в котором используется градиент для основного фона.Ссылаясь на палитру, фон варьируется от # 404040 , более светлый серый, до # 181818 , почти черный. Моя теория также заключается в том, что пользователи проводят больше всего времени, просматривая страницы списков воспроизведения:

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

Дополнительные комментарии :

  • Основной текст - чистый белый, а второстепенный текст - светло-серый - довольно стандартный
  • Каждый цвет - чистый оттенок серого, без оттенков
  • Акцентный цвет (зеленый) используется для разделения оттенков серого

Twitter (Интернет)

Слева направо : фон, карточка, цвет наведения, основной текст, дополнительный текст

Сразу же, просто взглянув на значения RGB, Twitter сильно отдает предпочтение синему цвету в качестве темного режима.Для каждого из оттенков значение синего является самым высоким.

Поскольку его логотип / акцентный цвет - синий, синяя окраска темного режима неудивительна и хорошо сочетается. Как и в случае с любым другим приложением, которое использует синий в качестве идентифицирующего цвета, Twitter надеется, что этот выбор цвета передает доверие и спокойствие.

Дополнительные комментарии :

  • Twitter использует карточки с разделителями. Карты светлее фона, чтобы казаться ближе, создавая ощущение глубины.
  • Разделители на карточках более светлого оттенка синего
  • Основной текст - чисто-белый, второстепенный текст - голубой
  • Синий акцентный цвет, используемый во всем
  • Логотип в виде значка белого цвета

Facebook (Интернет)

Слева направо : фон, карточка, цвет наведения, основной текст, дополнительный текст

Цветовые решения темного режима Facebook интересны. Если вы посмотрите на шестнадцатеричные коды, ни один из цветов не находится на линии оттенков серого.Вместо этого все значения RGB близки друг к другу, слегка увеличиваясь от красного до зеленого и до синего. Он настолько тонкий, что практически незаметен при использовании приложения:

Цвета также могут быть оттенками серого.

Дополнительные комментарии :

  • Facebook также использует более светлые карты
  • Более легкие разделители используются в левой и правой строках меню
  • Основной текст не белый, а оттенок очень светло-серого
  • Значки в правом верхнем углу тоже не совсем белые, они заключены в серые кружки с кнопками, а значки вверху имеют более темный оттенок серого.Иконки в левом меню цветные, а не

Youtube (Интернет)

Слева направо : фон, меню, цвет наведения, основной текст, дополнительный текст

Палитра темного режима, используемая YouTube, почти не интересна. Каждый оттенок серого находится точно на линиях оттенков серого. В отличие от вышеперечисленных приложений, здесь нет акцентного цвета. Вы не увидите красного значка YouTube нигде в приложении, кроме логотипа в левом верхнем углу.

Средний (приложение для iOS)

Слева направо : фон, строки меню, основной текст, дополнительный текст

Если бы в Medium не было темного режима, я бы определенно не использовал приложение каждую ночь перед сном 😅 Как и его простой черно-белый логотип, цвета темного режима приложения Medium для iOS очень просты.На мой взгляд, такая простота хорошо работает для издательской платформы - она ​​напоминает старомодные газеты.

Дополнительные комментарии :

  • Самый темный цвет фона, который мы когда-либо видели, почти чистый черный.
  • Medium также использует зеленый акцентный цвет во всем приложении.

Яблоко

iPhone

Слева направо : фон, карточка (Настройки), карточка (iMessage), основной текст, дополнительный текст

Темный режим для iPhone можно увидеть во встроенных приложениях Apple, таких как «Настройки», «iMessage», «Заметки», «Фотографии» и т. Д.Загружаемые приложения также могут распознавать, что вы установили темный режим iPhone, и автоматически настраивать их тему.

Дополнительные комментарии :

  • В отличие от всех предыдущих приложений, в темном режиме iPhone в качестве фона используется чистый черный цвет.
  • Цвета карт предпочитают синий. Как и Facebook, синий оттенок практически незаметен.

Mac

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

Однако в MacOS есть элементы типичного приложения темного режима: строки меню, карточки, основной / дополнительный текст и т.д. темный режим предсказуем.

Заключение

Если вы когда-нибудь думали, что все приложения в темном режиме начинают выглядеть одинаково, вы не ошиблись. У них есть общие элементы, о которых мы узнали: обычно темный, почти черный цвет фона, с более светлыми полосами меню сверху и / или по бокам; даже более легкие, закругленные уголки карточек разделяют содержимое и кажутся более близкими из-за цветового контраста; Ярко-белый основной текст и более мелкий, немного более темный вторичный текст… Все приложения сочетаются друг с другом.

Тем не менее, есть еще способы немного отклониться от этого шаблона. Мы видели градиент Spotify, синие оттенки Twitter и непрозрачный фон MacOS. Если вы разрабатываете приложение в темном режиме, я рекомендую вам найти способы незаметно выделиться. В конце концов, мы могли бы использовать некоторое разнообразие… и больше оттенков серого.

Спасибо за чтение!


Первоначально опубликовано в кодовой передаче на носителе .

Преобразование RGB в цвет HTML

В документах HTML цвета обычно представлены в виде шестнадцатеричных значений.Обработчики в листингах 31-1 и 31-2 показывают, как преобразовать 8-битные или 256 цветовые значения RGB в шестнадцатеричные значения. Укажите цвет RGB, представленный списком из трех чисел, каждое из которых имеет значение от 0 до 65535 .

ПРИЛОЖЕНИЕ

Открыть в редакторе скриптов

Листинг 31-1. AppleScript: обработчик, преобразующий цвет RGB в шестнадцатеричное значение.
  1. при convertRGBColorToHexValue (theRGBValues)
  2. установить theHexList на {"0", "1", "2", "3", "4", "5", "6", "7", "8", "9", "A", «B», «C», «D», «E», «F»}
  3. установите для параметра HexValue значение ""
  4. повторяется от 1 до подсчета значений RGB
  5. установить для CurrentRGBValue значение (элемент a из значенийRGBValues) div 256
  6. , если CurrentRGBValue равно 256, установите для CurrentRGBValue значение 255
  7. установите для параметра FirstItem значение элемента ((theCurrentRGBValue div 16) + 1) из списка HexList
  8. установите для SecondItem значение (((theCurrentRGBValue / 16 mod 1) * 16) + 1) в HexList
  9. установите для параметра HexValue значение (theHexValue, theFirstItem и theSecondItem) как строку
  10. повторитель конца
  11. возврат ("#" и theHexValue) в виде строки
  12. конец convertRGBColorToHexValue

JAVASCRIPT

Открыть в редакторе скриптов

Листинг 31-2. JavaScript: функция, преобразующая цвет RGB в шестнадцатеричное значение.
  1. функция convertRGBColorToHexValue (rgbValues) {
  2. var r = parseInt (rgbValues ​​[0], 10).toString (16) .slice (-2)
  3. если (r.length == 1)
  4. r = "0" + r
  5. var g = parseInt (rgbValues ​​[1], 10) .toString (16) .slice (-2)
  6. если (g.length == 1)
  7. г = "0" + г
  8. var b = parseInt (rgbValues ​​[2], 10) .toString (16) .slice (-2)
  9. если (р.длина == 1)
  10. b = "0" + b
  11. возврат ("#" + r + g + b)
  12. }

В листинге 31-3 показано, как вызвать обработчики из листинга 31-1 для преобразования указанного цвета RGB в шестнадцатеричное значение для использования в HTML.

ПРИЛОЖЕНИЕ

Открыть в редакторе скриптов

Листинг 31-3. AppleScript: Вызов обработчика для преобразования цвета RGB в шестнадцатеричное значение.
  1. установите для параметра RGBValues ​​значение (выберите цвет по умолчанию, {65535, 0, 0})
  2. convertRGBColorToHexValue (theRGBValues)
  3. -> Результат: "# FF0000"

JAVASCRIPT

Открыть в редакторе скриптов

Листинг 31-4. JavaScript: Вызов функции для преобразования цвета RGB в шестнадцатеричное значение.
  1. var app = Приложение.currentApplication ()
  2. app.includeStandardAdditions = true
  3. var color = app.chooseColor ({defaultColor: [1, 0, 0]})
  4. цвет = [Math.trunc (цвет [0] * 65535), Math.trunc (цвет [1] * 65535), Math.trunc (цвет [2] * 65535)]
  5. convertRGBColorToHexValue (цвет)
  6. // Результат: "# FF0000"

Примечание

В AppleScript команда выбрать цвет создает значения RGB в диапазоне от 0 до 65535 .В JavaScript значения RGB находятся в диапазоне от 0 до 1 . Эти значения необходимо преобразовать, чтобы они соответствовали используемым значениям AppleScript. Перечисление 31-4 демонстрирует это преобразование.

Указание цвета в HTML (в двух словах о веб-дизайне, 2-е издание)


Вы можете указать цвет определенных элементов страницы с помощью HTML-тегов. Есть два метода указания цветов в веб-документах: RGB. значения и название цвета.

16.1. Определение цвета по значениям RGB

Самый простой и точный способ чтобы указать цвет в HTML, по его числовому RGB (красный, зеленый, синий) значения. Описание цвета RGB см. В разделе 3.3 «Цвет в Интернете» в главе 3 «Принципы веб-дизайна для полиграфистов».

После того, как вы определили значения красного, зеленого и синего цветов вашего выбранный цвет (с этой задачей помогает инструмент для редактирования изображений), вам необходимо перевести их в их шестнадцатеричные эквиваленты в чтобы ввести их в цветовой тег HTML.Эти значения записываются в HTML со следующим синтаксисом:

 "#RRGGBB" 

RR обозначает шестнадцатеричное значение красного цвета, GG обозначает шестнадцатеричное значение зеленого цвета, а BB обозначает шестнадцатеричное значение синего цвета. С использованием эти значения, вы можете указать любой цвет из "истинного" цветовое "пространство" (миллионы цветов).

Давайте рассмотрим пример, чтобы пояснить это в контексте. Чтобы установить цвет фона документа до темно-оливково-зеленого, сначала найдите Значения RGB цвета (85, 107, 47) и преобразовать их в их шестнадцатеричные эквиваленты (55, 6B, 2F; объяснение преобразования следует).Затем значения можно поместить в тег HTML, в данном случае чтобы изменить цвет фона страницы:

  

16.1.1. Шестнадцатеричная система

Шестнадцатеричная система счисления - основание 16 (по сравнению с основанием 10). для десятичных чисел). В нем используются следующие 16 символов:

 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, A, B, C, D, E, F 

от A до F представляют десятичные значения от 10 до 15.

16.1.2. Преобразование десятичного числа в шестнадцатеричное

Вы можете вычислить шестнадцатеричные значения в диапазон от 0 до 255, разделив число на 16, чтобы получить первую цифру, затем используя остаток для второй цифры. Например, разделив десятичное число 203 на 16 дает 12 с остатком 11. шестнадцатеричное значение 12 - C; шестнадцатеричное значение 11 - B. Следовательно, шестнадцатеричный эквивалент 203 - CB.

К счастью, есть более простые методы преобразования чисел в шестнадцатеричный:

  • Используйте таблицу 16-1, которая переводит десятичные значения от 0 до 255.

  • Воспользуйтесь шестнадцатеричным калькулятором. На Macintosh вы можете скачать копия утилиты Calculator II (ftp://ftp.amug.org/pub/mirrors/info-mac/sci/calc/calculator-ii-15.hqx). Пользователи Windows могут найти шестнадцатеричный калькулятор в «Научный» вид стандартного калькулятора Windows.

  • Используйте онлайн-ресурсы. В Интернете есть несколько ресурсов для вычисление шестнадцатеричных эквивалентов. Некоторые позволяют вводить все три значения для красного, зеленого и синего и преобразовать в шестнадцатеричное одновременно показывая вам образец выбранного вами цвета.Примеры онлайн-расчетов включают:

    Конструктор цветных страниц Mediarama

    Вставьте десятичные значения RGB для элементов страницы, и эта страница автоматически создает образец страницы с выбранными вами цветами и HTML-код для тега . Видеть http://www.inquisitor.com/hex.html.

    URL Univox Интернет: RGB 2 Hex

    Это упрощенный инструмент без излишеств для преобразования десятичного RGB. значения в их шестнадцатеричные эквиваленты.См. Http://www.univox.com/rgb2hex.html.

Таблица 16-1. Десятичные и шестнадцатеричные эквиваленты

десятичное = шестнадцатеричное

десятичное = шестнадцатеричное

десятичное = шестнадцатеричное

десятичное = шестнадцатеричное

десятичное = шестнадцатеричное

десятичное = шестнадцатеричное

десятичное = шестнадцатеричное

десятичное = шестнадцатеричное

десятичное = шестнадцатеричное

десятичное = шестнадцатеричное

десятичное = шестнадцатеричное

десятичное = шестнадцатеричное

0 = 00

1 = 01

2 = 02

3 = 03

4 = 04

5 = 05

6 = 06

7 = 07

8 = 08

9 = 09

10 = 0A

11 = 0B

12 = 0C

13 = 0D

14 = 0E

15 = 0F

16 = 10

17 = 11

18 = 12

19 = 13

20 = 14

21 = 15

22 = 16

23 = 17

24 = 18

25 = 19

26 = 1A

27 = 1B

28 = 1С

29 = 1D

30 = 1Э

31 = 1F

32 = 20

33 = 21

34 = 22

35 = 23

36 = 24

37 = 25

38 = 26

39 = 27

40 = 28

41 = 29

42 = 2А

43 = 2B

44 = 2C

45 = 2D

46 = 2Э

47 = 2F

48 = 30

49 = 31

50 = 32

51 = 33

52 = 34

53 = 35

54 = 36

55 = 37

56 = 38

57 = 39

58 = 3A

59 = 3B

60 = 3C

61 = 3D

62 = 3Э

63 = 3F

64 = 40

65 = 41

66 = 42

67 = 43

68 = 44

69 = 45

70 = 46

71 = 47

72 = 48

73 = 49

74 = 4А

75 = 4Б

76 = 4C

77 = 4D

78 = 4Э

79 = 4F

80 = 50

81 = 51

82 = 52

83 = 53

84 = 54

85 = 55

86 = 56

87 = 57

88 = 58

89 = 59

90 = 5А

91 = 5B

92 = 5C

93 = 5D

94 = 5E

95 = 5F

96 = 60

97 = 61

98 = 62

99 = 63

100 = 64

101 = 65

102 = 66

103 = 67

104 = 68

105 = 69

106 = 6А

107 = 6B

108 = 6C

109 = 6D

110 = 6Э

111 = 6F

112 = 70

113 = 71

114 = 72

115 = 73

116 = 74

117 = 75

118 = 76

119 = 77

120 = 78

121 = 79

122 = 7A

123 = 7B

124 = 7C

125 = 7D

126 = 7E

127 = 7F

128 = 80

129 = 81

130 = 82

131 = 83

132 = 84

133 = 85

134 = 86

135 = 87

136 = 88

137 = 89

138 = 8A

139 = 8B

140 = 8C

141 = 8D

142 = 8E

143 = 8F

144 = 90

145 = 91

146 = 92

147 = 93

148 = 94

149 = 95

150 = 96

151 = 97

152 = 98

153 = 99

154 = 9A

155 = 9B

156 = 9C

157 = 9D

158 = 9E

159 = 9F

160 = A0

161 = A1

162 = A2

163 = A3

164 = A4

165 = A5

166 = A6

167 = A7

168 = A8

169 = A9

170 = AA

171 = AB

172 = AC

173 =

нашей эры

174 = AE

175 = AF

176 = B0

177 = B1

178 = В2

179 = B3

180 = B4

181 = B5

182 = B6

183 = B7

184 = B8

185 = B9

186 = BA

187 = BB

188 = BC

189 = BD

190 = BE

191 = BF

192 = C0

193 = C1

194 = C2

195 = C3

196 = C4

198 = C6

199 = C7

200 = C8

201 = C9

202 = CA

203 = CB

204 = CC

205 = CD

206 = CE

207 = CF

208 = D0

209 = D1

210 = D2

211 = D3

212 = D4

213 = D5

214 = D6

215 = D7

216 = D8

217 = D9

218 = DA

219 = DB

220 = DC

221 = DD

222 = DE

223 = DF

224 = E0

225 = E1

226 = E2

227 = E3

228 = E4

229 = E5

230 = E6

231 = E7

232 = E8

233 = E9

234 = EA

235 = EB

236 =

по К.Э.

237 = ED

238 = EE

239 = EF

240 = F0

241 = F1

242 = F2

243 = F3

244 = F4

245 = F5

246 = F6

247 = F7

248 = F8

249 = F9

250 = FA

251 = FB

252 = FC

253 = FD

254 = FE

255 = FF

16.1.3. Шестнадцатеричные значения для цветов веб-палитры

Веб-палитра - это набор из 216 цветов, которые не будут смещаться или размываться. при рендеринге в браузерах на 8-битных мониторах (для тщательного объяснение веб-палитры см. в главе 3 «Принципы веб-дизайна для полиграфистов»). Все цвета в веб-палитра состоит из комбинации следующих шести шестнадцатеричных значений: 00, 33, 66, 99, CC, и FF.


15.7. Демистификация CGI 16.2. Указание цветов по имени

Авторские права © 2002 O'Reilly & Associates. Все права защищены.

HEX по сравнению с RGB - Goedemorgen

Если вы когда-либо создавали или изменяли стили для веб-сайта, или если вы цифровой художник, то вы, вероятно, видели HEX и / или RGB. И HEX, и RGB используются для определения цветов с помощью кода, поэтому вы можете часто видеть это в программном обеспечении, таком как Adobe Creative Suite, или в веб-дизайне.

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

Разница между HEX и RGB

В чем разница между HEX и RGB и когда следует использовать тот или иной цветовой тип? По сути, функциональность обоих цветовых типов одинакова, то есть они оба будут отображать один и тот же цвет. Визуально эти два цветотипа выглядят по-разному.В цвете HEX используется сочетание шести цифр и символов, а в цвете RGB используются три набора из трех чисел в диапазоне от 0 до 255.

Давайте посмотрим на этот цветовой тип на примере, а для нашего примера я выберу основной цвет акцента темы Goedemorgen, который представляет собой синий цвет .

Пример цвета HEX:

 # 0161bd 

Пример цвета RGB:

 RGB (1,97,189) 

Как видите, они оба выглядят по-разному, но когда вы добавляете каждый из этих типов к двум разным элементам, цвет этих элементов будет идентичным.Теперь вы, вероятно, задаетесь вопросом, в чем причина использования цвета RGB, если цвет HEX намного проще в использовании. Что ж, каждый цветовой тип имеет различное использование, и красота цвета RGB в том, что он позволяет добавить непрозрачность вашему цвету.

Добавление непрозрачности к цвету может быть удобно, если вы хотите добавить более светлый или более темный цвет фона к определенному разделу. Например, если вы хотите добавить оверлей с аналогичным стилем в раздел Jumbotron в теме Goedemorgen, это можно легко сделать с помощью RGBa (красный, зеленый, синий и альфа) цвет:

 rgba (0,0,0,0.5) 

Как вы могли заметить, мы добавили четвертый аргумент к нашему цвету, который определяет непрозрачность или альфа-канал элемента. Диапазон непрозрачности составляет от 0,0 (полная прозрачность) до 1,0 (полная непрозрачность). В нашем примере мы использовали 0,5;

Полезные ресурсы

Ниже вы можете найти несколько онлайн-инструментов, которые помогут вам создать цветовую палитру из цветов HEX и при необходимости преобразовать некоторые из этих цветов в RGBa.

Генератор цветовых схем от Coloors - на этом веб-сайте есть множество предустановленных цветовых схем, которые вы можете выбрать для своего проекта.Каждая цветовая схема состоит из пяти цветов, которые прекрасно сочетаются друг с другом. Вы можете перейти к следующей цветовой схеме, щелкнув пробел на клавиатуре.

Добавить комментарий

Ваш адрес email не будет опубликован.