Html безопасные цвета: Таблица «безопасных» цветов – Цвета html — Википедия

Безопасные веб цвета » Инструменты вебмастера

Когда было время 256-цветных мониторов применялась "безопасная палитра", конечно она применяется и сейчас. У безопасной палитры всего три главных цвета для смешивания - R G B и соответствуют значениям: 00, 33, 66, 99, CC, FF.
Вообще, цветовая палитра 6x6x6 является приоритетной при выборе цвета для фона или цвета шрифта.
Вашему вниманию представляется палитра "безопасных веб цветов", которые одинаково хорошо будут отображаться во всех браузерах и во всех оперативных системах.
Имя цвета для HTML Код для HTML R G B

Красные

IndianRed CD 5C 5C 205 92 92
LightCoral F0 80 80 240 128 128
Salmon FA 80 72 250 128 114
DarkSalmon E9 96 7A 233 150 122
LightSalmon FF A0 7A 255 160 122
Crimson DC 14 3C 220 20 60
Red
FF 00 00
255 0 0
FireBrick B2 22 22 178 34 34
DarkRed 8B 00 00 139 0 0

Розовые

Pink FF C0 CB 255 192 203
LightPink FF B6 C1 255 182 193
HotPink FF 69 B4 255 105 180
DeepPink FF 14 93 255 20 147
MediumVioletRed C7 15 85 199 21 133
PaleVioletRed DB 70 93 219 112 147

Оранжевые

LightSalmon FF A0 7A 255 160 122
Coral FF 7F 50 255 127 80
Tomato FF 63 47 255 99 71
OrangeRed FF 45 00 255 69 0
DarkOrange FF 8C 00 255 140 0
Orange FF A5 00 255 165 0

Жёлтые

Gold FF D7 00 255 215 0
Yellow FF FF 00 255 255 0
LightYellow FF FF E0 255 255 224
LemonChiffon FF FA CD 255 250 205
LightGoldenrodYellow FA FA D2 250 250 210
PapayaWhip FF EF D5 255 239 213
Moccasin FF E4 B5 255 228 181
PeachPuff FF DA B9 255 218 185
PaleGoldenrod EE E8 AA 238 232 170
Khaki F0 E6 8C 240 230 140
DarkKhaki BD B7 6B 189 183 107

Фиолетовые

Lavender E6 E6 FA 230 230 250
Thistle D8 BF D8 216 191 216
Plum DD A0 DD 221 160 221
Violet EE 82 EE 238 130 238
Orchid DA 70 D6 218 112 214
Fuchsia FF 00 FF 255 0 255
Magenta FF 00 FF 255 0 255
MediumOrchid BA 55 D3 186 85 211
MediumPurple 93 70 DB 147 112 219
BlueViolet 8A 2B E2 138 43 226
DarkViolet 94 00 D3 148 0 211
DarkOrchid 99 32 CC 153 50 204
DarkMagenta 8B 00 8B 139 0 139
Purple 80 00 80 128 0 128
Indigo 4B 00 82 75 0 130
SlateBlue 6A 5A CD 106 90 205
DarkSlateBlue 48 3D 8B 72 61 139

Зелёные

GreenYellow AD FF 2F 173 255 47
Chartreuse 7F FF 00
127 255 0
LawnGreen 7C FC 00 124 252 0
Lime 00 FF 00 0 255 0
LimeGreen 32 CD 32 50 205 50
PaleGreen 98 FB 98 152 251 152
LightGreen 90 EE 90 144 238 144
MediumSpringGreen 00 FA 9A 0 250 154
SpringGreen 00 FF 7F 0 255 127
MediumSeaGreen 3C B3 71 60 179 113
SeaGreen 2E 8B 57 46 139 87
ForestGreen 22 8B 22 34 139 34
Green 00 80 00 0 128 0
DarkGreen 00 64 00 0 100 0
YellowGreen 9A CD 32 154 205 50
OliveDrab 6B 8E 23 107 142 35
Olive 80 80 00 128 128 0
DarkOliveGreen 55 6B 2F 85 107 47
MediumAquamarine 66 CD AA 102 205 170
DarkSeaGreen 8F BC 8F 143 188 143
LightSeaGreen 20 B2 AA 32 178 170
DarkCyan 00 8B 8B 0 139 139
Teal 00 80 80 0 128 128

Синие

Aqua 00 FF FF 0 255 255
Cyan 00 FF FF 0 255 255
LightCyan E0 FF FF 224 255 255
PaleTurquoise AF EE EE 175 238 238
Aquamarine 7F FF D4 127 255 212
Turquoise 40 E0 D0 64 224 208
MediumTurquoise 48 D1 CC 72 209 204
DarkTurquoise 00 CE D1 0 206 209
CadetBlue 5F 9E A0 95 158 160
SteelBlue 46 82 B4 70 130 180
LightSteelBlue B0 C4 DE 176 196 222
PowderBlue B0 E0 E6 176 224 230
LightBlue AD D8 E6 173 216 230
SkyBlue 87 CE EB 135 206 235
LightSkyBlue 87 CE FA 135 206 250
DeepSkyBlue 00 BF FF 0 191 255
DodgerBlue 1E 90 FF 30 144 255
CornflowerBlue 64 95 ED 100 149 237
MediumSlateBlue 7B 68 EE 123 104 238
RoyalBlue 41 69 E1 65 105 225
Blue 00 00 FF 0 0 255
MediumBlue 00 00 CD 0 0 205
DarkBlue 00 00 8B 0 0 139
Navy 00 00 80 0 0 128
MidnightBlue 19 19 70 25 25 112

Коричневые

Cornsilk FF F8 DC 255 248 220
BlanchedAlmond FF EB CD 255 235 205
Bisque FF E4 C4 255 228 196
NavajoWhite FF DE AD 255 222 173
Wheat F5 DE B3 245 222 179
BurlyWood DE B8 87 222 184 135
Tan D2 B4 8C 210 180 140
RosyBrown BC 8F 8F 188 143 143
SandyBrown F4 A4 60 244 164 96
Goldenrod DA A5 20 218 165 32
DarkGoldenrod B8 86 0B 184 134 11
Peru CD 85 3F 205 133 63
Chocolate D2 69 1E 210 105 30
SaddleBrown 8B 45 13 139 69 19
Sienna A0 52 2D 160 82 45
Brown A5 2A 2A 165 42 42
Maroon 80 00 00 128 0 0

Белые

White FF FF FF 255 255 255
Snow FF FA FA 255 250 250
Honeydew F0 FF F0 240 255 240
MintCream F5 FF FA 245 255 250
Azure F0 FF FF 240 255 255
AliceBlue F0 F8 FF 240 248 255
GhostWhite F8 F8 FF 248 248 255
WhiteSmoke F5 F5 F5 245 245 245
Seashell FF F5 EE 255 245 238
Beige F5 F5 DC 245 245 220
OldLace FD F5 E6 253 245 230
FloralWhite FF FA F0 255 250 240
Ivory FF FF F0 255 255 240
AntiqueWhite FA EB D7 250 235 215
Linen
FA F0 E6
250 240 230
LavenderBlush FF F0 F5 255 240 245
MistyRose FF E4 E1 255 228 225

Серые

Gainsboro DC DC DC 220 220 220
LightGrey D3 D3 D3 211 211 211
Silver C0 C0 C0 192 192 192
DarkGray A9 A9 A9 169 169 169
Gray 80 80 80 128 128 128
DimGray 69 69 69 105 105 105
LightSlateGray 77 88 99 119 136 153
SlateGray 70 80 90 112 128 144
DarkSlateGray 2F 4F 4F 47 79 79
Black 00 00 00 0 0 0

Безопасные цвета для сайта — Технический блог

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

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

При этом в WEB принято, что градация каждого первичного цвета состоит из 256 оттенков от нуля до 255 или от 00 до FF в шестнадцатеричном исчислении. В итоге мы получим более 16 миллионов цветов (256*256*256) и считается, что это предел для человеческого глаза.

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

Кроме того в некоторых системах браузер по неизвестной мне причине почему-то не может правильно отобразить определенные цвета и тогда он подбирает ближайший похожий. И получается, что светло-серый #eeeeee как бы превращается в #ffffff, то есть не отличается от него на экране монитора. Что согласитесь не одно и тоже, ведь тогда вы не видите фон, рамки и прочее. Я наблюдал это лично в Linux системах в браузере FireFox. Допускаю, что нужно было донастроить операционную систему, драйверы или еще чего, но факт имеет место быть, некоторые цвета искажаются, что портит цветовое оформление сайта. А вот с безопасным цветом, например #cccccc такие неприятности не происходят.

Исходя из вышеописанного при определении цветовой палитры сайтов принято ограничивать палитру загрубив градацию каждого из первичных цветом до 6 уровней (00, 33, 66, 99, CC, FF в шестнадцатеричном исчислении). Считается, что любой из полученных 216 цветов (6*6*6) везде будет отображаться правильным образом и без искажений.

Таблица безопасных цветов для сайта

Так как все градации первичных цветов кратны 33 (тридцать три в шестнадцатеричном исчислении) и имеют одинаковые цифры в значениях единиц и десятков, то их значения можно записать в сокращенном формате, то есть вместо #FFFFFF, я буду использовать #FFF.

#FFF #FFC #FF9 #FF6 #FF3 #FF0
#FCF #FCC #FC9 #FC6 #FC3 #FC0
#F9F #F9C #F99 #F96 #F93 #F90
#F6F #F6C #F69 #F66 #F63 #F60
#F3F #F3C #F39 #F36 #F33 #F30
#F0F #F0C #F09 #F06 #F03 #F00
#CFF #CFC #CF9 #CF6 #CF3 #CF0
#CCF #CCC #CC9 #CC6 #CC3 #CC0
#C9F #C9C #C99 #C96 #C93 #C90
#C6F #C6C #C69 #C66 #C63 #C60
#C3F #C3C #C39 #C36 #C33 #C30
#C0F #C0C #C09 #C06 #C03 #C00
#9FF #9FC #9F9 #9F6 #9F3 #9F0
#9CF #9CC #9C9 #9C6 #9C3 #9C0
#99F #99C #999 #996 #993 #990
#96F #96C #969 #966 #963 #960
#93F #93C #939 #936 #933 #930
#90F #90C #909 #906 #903 #900
#6FF #6FC #6F9 #6F6 #6F3 #6F0
#6CF #6CC #6C9 #6C6 #6C3 #6C0
#69F #69C #699 #696 #693 #690
#66F #66C #669 #666 #663 #660
#63F #63C #639 #636 #633 #630
#60F #60C #609 #606 #603 #600
#3FF #3FC #3F9 #3F6 #3F3 #3F0
#3CF #3CC #3C9 #3C6 #3C3 #3C0
#39F #39C #399 #396 #393 #390
#36F #36C #369 #366 #363 #360
#33F #33C #339 #336 #333 #330
#30F #30C #309 #306 #303 #300
#0FF #0FC #0F9 #0F6 #0F3 #0F0
#0CF #0CC #0C9 #0C6 #0C3 #0C0
#09F #09C #099 #096 #093 #090
#06F #06C #069 #066 #063 #060
#03F #03C #039 #036 #033 #030
#00F #00C #009 #006 #003 #000

Как использовать таблицу безопасных цветов

Моя таблица состоит из 216 ячеек. Фон каждой из них записан в HEX формате и может использоваться в CSS стилях для графики, текста и фонов.

Существуют несколько основных способов представления цветов в вебе. Один из них в виде #123ABC. Это представление в виде трёх пар шестнадцатеричных цифр, где каждая пара отвечает за свой цвет: две первые цифры — красный, две в середине — зелёный, две последние цифры — синий. Также допускается краткое представление цвета в виде #ABC, что будет интерпретировано как #AABBCC.

Благодарности

При написании статьи были использованы следующие источники:

  1. http://www.artlebedev.ru/tools/colors/
  2. https://ru.wikipedia.org/wiki/Цвета_HTML

seodon.ru | Цвета HTML - Безопасные цвета HTML

Опубликовано: 05.03.2011 Последняя правка: 16.12.2015

На этой странице представлена таблица безопасных цветов HTML в формате RGB (для CSS и разных приложений) и HEX (для HTML и CSS). Используя эти цвета, вы можете быть уверены, что они будут одинаково отображены любыми старыми и новыми устройствами, на которых будут просматривать ваш сайт (мониторы, мобильные телефоны и т.д.) и всеми браузерами. При указании кода цвета в HTML перед ним необходимо поставить знак решетка (#). Все представленные ниже цвета допускается задавать в сокращенном виде, например #F3C вместо #FF33CC или #333 вместо #333333, а некоторые из них указывать по имени цвета.

255,204,102 255,204,51 255,204,0 204,153,0 153,102,0
FFCC66 FFCC33 FFCC00 CC9900 996600
         
255,204,153 204,153,102 204,153,51 153,102,51 102,51,0
FFCC99 CC9966 CC9933 996633 663300
         
255,153,102 255,153,51 255,153,0 204,102,51 204,102,0
FF9966 FF9933 FF9900 CC6633 CC6600
         
255,102,51 255,102,0 255,51,0 204,51,0 153,51,0
FF6633 FF6600 FF3300 CC3300 993300
         
255,204,204 204,153,153 153,102,102 102,51,51 51,0,0
FFCCCC CC9999 996666 663333 330000
         
255,153,153 204,102,102 204,51,51 153,51,51 102,0,0
FF9999 CC6666 CC3333 993333 660000
         
255,102,102 255,51,51 255,0,0 204,0,0 153,0,0
FF6666 FF3333 FF0000 CC0000 990000
         
255,102,153 255,51,102 255,0,51 204,0,51 153,0,51
FF6699 FF3366 FF0033 CC0033 990033
         
255,153,204 204,102,153 204,51,102 153,51,102 102,0,51
FF99CC CC6699 CC3366 993366 660033
         
255,51,153 255,0,153 255,0,102 204,0,102 153,0,102
FF3399 FF0099 FF0066 CC0066 990066
         
255,102,204 255,51,204 255,0,204 204,51,153 204,0,153
FF66CC FF33CC FF00CC CC3399 CC0099
         
255,204,255 204,153,204 153,102,153 102,51,102 51,0,51
FFCCFF CC99CC 996699 663366 330033
         
255,153,255 204,102,204 204,51,204 153,51,153 102,0,102
FF99FF CC66CC CC33CC 993399 660066
         
255,102,255 255,51,255 255,0,255 204,0,204 153,0,153
FF66FF FF33FF FF00FF CC00CC 990099
         
204,102,255 204,51,255 204,0,255 153,0,204 102,0,153
CC66FF CC33FF CC00FF 9900CC 660099
         
204,153,255 153,102,204 153,51,204 102,51,153 51,0,102
CC99FF 9966CC 9933CC 663399 330066
         
153,102,255 153,51,255 153,0,255 102,51,204 102,0,204
9966FF 9933FF 9900FF 6633CC 6600CC
         
102,51,255 102,0,255 51,0,255 51,0,204 51,0,153
6633FF 6600FF 3300FF 3300CC 330099
         
204,204,255 153,153,204 102,102,153 51,51,102 0,0,51
CCCCFF 9999CC 666699 333366 000033
         
153,153,255 102,102,204 51,51,204 51,51,153
9999FF 6666CC 3333CC 333399 000066
         
102,102,255 51,51,255 0,0,255 0,0,204 0,0,153
6666FF 3333FF 0000FF 0000CC 000099
         
102,153,255 51,102,255 0,51,255 0,51,204 0,51,153
6699FF 3366FF 0033FF 0033CC 003399
         
153,204,255 102,153,204 51,102,204 51,102,153 0,51,102
99CCFF 6699CC 3366CC 336699 003366
         
51,153,255 0,153,255 0,102,255 0,102,204 0,102,153
3399FF 0099FF 0066FF 0066CC 006699
         
102,204,255 51,204,255 0,204,255 51,153,204 0,153,204
66CCFF 33CCFF 00CCFF 3399CC 0099CC
         
204,255,255 153,204,204 102,153,153 51,102,102 0,51,51
CCFFFF 99CCCC 669999 336666 003333
         
153,255,255 102,204,204 51,204,204 51,153,153 0,102,102
99FFFF 66CCCC 33CCCC 339999 006666
         
102,255,255 51,255,255 0,255,255 0,204,204 0,153,153
66FFFF 33FFFF 00FFFF 00CCCC 009999
         
102,255,204 51,255,204 0,255,204 0,204,153 0,153,102
66FFCC 33FFCC 00FFCC 00CC99 009966
         
153,255,204 102,204,153 51,204,153 51,153,102 0,102,51
99FFCC 66CC99 33CC99 339966 006633
         
102,255,153 51,255,153 0,255,153 51,204,102 0,104,102
66FF99 33FF99 00FF99 33CC66 00CC66
         
51,255,102 0,255,102 0,255,51 0,204,51 0,153,51
33FF66 00FF66 00FF33 00CC33 009933
         
153,255,153 153,204,153 102,153,102 51,102,51 0,51,0
99FF99 99CC99 669966 336633 003300
         
204,255,204 102,204,102 51,204,51 51,153,51 0,102,0
CCFFCC 66CC66 33CC33 339933 006600
         
102,255,102 51,255,51 0,255,0 0,204,0 0,153,0
66FF66 33FF33 00FF00 00CC00 009900
         
153,255,102 102,255,51 51,255,0 51,204,0 51,153,0
99FF66 66FF33 33FF00 33CC00 339900
         
204,255,153 153,204,102 102,204,51 102,153,51 51,102,0
CCFF99 99CC66 66CC33 669933 336600
         
153,255,51 153,255,0 102,255,0 102,204,0 102,153,0
99FF33 99FF00 66FF00 66CC00 669900
         
204,255,102 204,255,51 204,255,0 153,204,51 153,204,0
CCFF66 CCFF33 CCFF00 99CC33 99CC00
         
255,255,204 204,204,153 153,153,102 102,102,51 51,51,0
FFFFCC CCCC99 999966 666633 333300
         
255,255,153 204,204,102 204,204,51 153,153,51 102,102,0
FFFF99 CCCC66 CCCC33 999933 666600
         
255,255,102 255,255,51 255,255,0 204,204,0 153,153,0
FFFF66 FFFF33 FFFF00 CCCC00 999900
         
255,255,255 204,204,204 153,153,153 102,102,102 51,51,51 0,0,0
FFFFFF CCCCCC 999999 666666 333333 000000
           

Каждый HEX-код состоит из трех пар шестнадцатеричных значений: первая пара отвечает за красный цвет, вторая — за зеленый, третья — за синий. Коды безопасной палитры могут состоять только из пар — 00, 33, 66, 99, СС и FF. Если код цвета содержит какое-либо другое значение, то этот цвет не из безопасной палитры.

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

«Безопасные» или Web Safe цвета для веб-дизайна

4.9 из 5 на основе 8 оценок

18.12.2015

«Безопасные», Web Safe или Browser Safe цвета – это палитра, состоящая из 216 оттенков, которые отображаются максимально точно независимо от монитора компьютера или выбранного браузера, способного отображать, по крайней мере, 8-ми битный цвет (256 цветов). Причина наличия в палитре только 216 вместо максимальных 256-ти цветов заключена в том, что именно эти основные цвета отображаются на всех компьютерах одинаково.

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

Определяли 256 цветов согласно математической формуле, а не по их эстетическим характеристикам, так как описывались они всего 8-мью битами компьютерной информации. Эта базовая палитра и включает в себя 216 цветов, которые сегодня мы называем «безопасными».

Web Safe цвета определяются таким градациями RGB: 0, 51, 102, 153, 204 и 255 (0, 33, 66, 99, СС, FF), которые указывают на процентное присутствие того или иного цвета: 0, 20, 40, 60, 80 и 100%.

Когда необходимо использовать «безопасные» цвета?

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

Если вы создаете картинки, текст или любые другие элементы, стоит обращаться к Web Safe палитре, так как это позволит получать более чистое изображение, отображаемое и для вас, и для пользователя всегда одинаково.

К сожалению, точной инструкции по подбору правильной цветовой палитры, которая бы привлекала, а не отталкивала пользователя, нет. Это субъективное понятие. Однако обратившись к основной «безопасной» палитре вы сможете не сомневаться в том, что каждый точно воспринимает представленный на сайте цвет.

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

По материалам http://www.htmlgoodies.com/

Безопасные цвета и html

безопасные цвета

Безопасные цвета или, по-другому, web-палитра были созданы для согласования браузеров. Раньше, когда компьютеры и мониторы не могли отображать необходимое количество оттенков, разработчики очень беспокоились о несоответствии. Они волновались, что их странички будут неодинаково хорошо смотреться в разных браузерах и мониторах. Старые устройства вывода ограничивали деятельность разработчиков. Поэтому для безопасности и сохранности исходного вида интернет-страниц и были придуманы веб-цвета.

безопасные цвета html

Создание

Как известно, html и css используют несколько способов для определения значения цвета. Большинство веб-разработчиков используют специальные RGB-коды, в которых указывается индивидуальный номер оттенка. Например, такая запись: «#223366» означает, чтобы было взято 22 – красного, 33 – зеленного и 66 – синего. Последнее значение находится в преобладающем количестве. И если смешать в таких пропорциях краски, то получится темно синий цвет. RGB является сокращением от английских слов Red, Green и Blue. И именно эти цвета были выбраны для аддитивной цветовой модели, с помощью которой и происходит синтез красок. Некоторые предполагают, что безопасные цвета html были назначены наугад. Но это не так. Выбор происходил при помощи сухого математического расчета. Были выбраны только те значения, которые делятся на 3 и которые имеют пару одинаковых цифр. Например: "# 663366" или "#cc0099" (где с означает 13). А такие цвета, как "#ff66d6" или "#9999AA" уже не относятся к безопасным цветам, так как нарушают основные правила. Если монитор встречал неизвестный ему оттенок, то он пытался заменить его или создать новую краску. Чаще всего использовалась система дитеринг, в которой происходило смешивание цветов с целью создания другого. Иногда такой способ помогал избежать необратимых последствий неправильного отображения, но бывали случаи, когда картина сайта полностью менялась. Именно поэтому была создана отдельная палитра цветов, которая имела полное согласование с устройствами и браузерами того времени.

безопасные цвета для сайта

Использование

Как вы, наверное, уже поняли, безопасные цвета для сайта выглядят очень скудно, так как нет большого многообразия оттенков и переливов. Но во времена использования старых мониторов такая палитра была единственным выходом для получения одинакового отображения картинки на разных устройствах. Сейчас использовать безопасные цвета нет необходимости, ведь практически у каждого пользователя интернета стоит современное оборудование, которое с легкостью производит уже все известные оттенки. Сайты выглядят очень скудно, если использовать только веб-палитру. Некоторые графические редакторы (например Adobe Photoshop) до сих пор оставляют возможность подбора только безопасного цвета. Но прогресс не стоит на месте, и каждый год в сфере программирования появляется что-нибудь новое. 

Заключение

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

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

Ваш адрес email не будет опубликован. Обязательные поля помечены *