Меню

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



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

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

Вашему вниманию предлагается палитра цветов, рекомендуемых для экранного дизайна.

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

Палитра состоит из 32 сочетаний 6 оттенков красного, зеленого и синего. Эти градации — 00, 33, 66, 99, CC, FF. Над каждым цветом указаны значения RGB (для создания цвета в графическом редакторе или задания в CSS).

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

  • Таблица RGB цветов
  • Правильное сочетание цветов
  • Сводная таблица стилей
  • Сводная таблица специальных символов
  • Accessibility color wheel — сервис подбора цветов для фона и текста с учетом пользователей с ограниченными способностями.
    Accessibility color wheel поможет выбрать оптимальную пару цветов. В интерфейсе присутствует панель, имитирующая 3 вида цветовой слепоты.

Источник

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

Понятие «безопасные веб-цвета» (Web Safe colors) вошло в обиход в середине 90-х годов прошлого века, когда предпринимались попытки стандартизации воспроизведения цвета для разных платформ и браузеров.

Что такое безопасные веб-цвета.

В девяностые годы подавляющее большинство компьютеров было способно вывести на экран одновременно не более 256 цветов. У данных ограничений было много причин, в первую очередь – это высокая стоимость видеопамяти, ранние видеокарты имели максимальный объем 512 КБ, достаточный для отображения 256 цветов одновременно (8 бит), воспроизведение же большего количества требовало увеличения графической памяти.

Помимо ограниченных возможностей ПК, в то время, существовала проблема цветопередачи, один и тот же цвет на различных типах компьютеров, мониторов и браузерах мог выглядеть по-разному вследствие замены его ближайшим или же дизеринга (имитации путем размещения растровых точек доступных цветов в шахматном порядке, что при значительном уменьшении создает иллюзию целостности цвета). Данные причины и послужили поводом для создания Линдой Вайнман «безопасной» палитры состоящей из 216 цветов – своего рода неформального стандарта для сети Интернет. Палитра была сформирована из равномерно распределенных цветов красного, зеленого, синего в диапазоне от 00 до FF с шагом в 20% (00, 33, 66, 99, CC, FF) для каждого канала. Почему 216, а не 256? Дело в том, что остальные сорок резервировались либо операционными системами (Windows, Mac OS), либо же браузерами (Internet Explorer, Netscape).

Читайте также:  Какого цвета бывают мускари

На протяжении 2000-х использование веб-безопасных цветов постепенно теряло свою актуальность. Видеокарты совершенствовались, а использование 8-битных дисплеев сокращалось в пользу 24-битных.

На сегодняшний день компьютеры поддерживают миллионы цветов. Мониторы, операционные системы, программное обеспечение не всегда отображают их одинаково точно, но представление цвета, как правило, достаточно схоже. Для сравнения: в данный момент компьютеры и мониторы способны отображать 24-битный или 32-битный цвет, что соответствует 16 777 216 возможных оттенков. Однако, не смотря на это Как говорилось выше, ограничения использования в вебе исключительно «безопасных» цветов считается неким анахронизмом, в палитрах продуктов Adobe (Фотошоп, Иллюстратор, Премьер) до сих пор присутствует опция «Only Web Colors» («Только Web-цвета»).

Таблица «безопасных» цветов.

Приведенная ниже таблица представляет двести шестнадцать «безопасных» цветов и их значения в шестнадцатеричном коде (HEX), HSL и RGB. Перейдя по ссылке в таблице можно ознакомится с другими параметрами, цветовыми схемами, использованием цвета в CSS и SVG.

Цвет H S L R G B
#000000 0°, 0%, 0% 0%, 0%, 0%
#000033 240°, 100%, 10% 0%, 0%, 20%
#000066 240°, 100%, 20% 0%, 0%, 40%
#000099 240°, 100%, 30% 0%, 0%, 60%
#0000CC 240°, 100%, 40% 0%, 0%, 80%
#0000FF 240°, 100%, 50% 0%, 0%, 100%
#003300 120°, 100%, 10% 0%, 20%, 0%
#003333 180°, 100%, 10% 0%, 20%, 20%
#003366 210°, 100%, 20% 0%, 20%, 40%
#003399 220°, 100%, 30% 0%, 20%, 60%
#0033CC 225°, 100%, 40% 0%, 20%, 80%
#0033FF 228°, 100%, 50% 0%, 20%, 100%
#006600 120°, 100%, 20% 0%, 40%, 0%
#006633 150°, 100%, 20% 0%, 40%, 20%
#006666 180°, 100%, 20% 0%, 40%, 40%
#006699 200°, 100%, 30% 0%, 40%, 60%
#0066CC 210°, 100%, 40% 0%, 40%, 80%
#0066FF 216°, 100%, 50% 0%, 40%, 100%
#009900 120°, 100%, 30% 0%, 60%, 0%
#009933 140°, 100%, 30% 0%, 60%, 20%
#009966 160°, 100%, 30% 0%, 60%, 40%
#009999 180°, 100%, 30% 0%, 60%, 60%
#0099CC 195°, 100%, 40% 0%, 60%, 80%
#0099FF 204°, 100%, 50% 0%, 60%, 100%
#00CC00 120°, 100%, 40% 0%, 80%, 0%
#00CC33 135°, 100%, 40% 0%, 80%, 20%
#00CC66 150°, 100%, 40% 0%, 80%, 40%
#00CC99 165°, 100%, 40% 0%, 80%, 60%
#00CCCC 180°, 100%, 40% 0%, 80%, 80%
#00CCFF 0°, 0%, 0% %, %, %
#00FF00 120°, 100%, 50% 0%, 100%, 0%
#00FF33 132°, 100%, 50% 0%, 100%, 20%
#00FF66 144°, 100%, 50% 0%, 100%, 40%
#00FF99 156°, 100%, 50% 0%, 100%, 60%
#00FFCC 168°, 100%, 50% 0%, 100%, 80%
#00FFFF 180°, 100%, 50% 0%, 100%, 100%
#330000 0°, 100%, 10% 20%, 0%, 0%
#330033 300°, 100%, 10% 20%, 0%, 20%
#330066 270°, 100%, 20% 20%, 0%, 40%
#330099 260°, 100%, 30% 20%, 0%, 60%
#3300CC 255°, 100%, 40% 20%, 0%, 80%
#3300FF 252°, 100%, 50% 20%, 0%, 100%
#333300 60°, 100%, 10% 20%, 20%, 0%
#333333 0°, 0%, 20% 20%, 20%, 20%
#333366 240°, 33%, 30% 20%, 20%, 40%
#333399 240°, 50%, 40% 20%, 20%, 60%
#3333CC 240°, 60%, 50% 20%, 20%, 80%
#3333FF 240°, 100%, 60% 20%, 20%, 100%
#336600 90°, 100%, 20% 20%, 40%, 0%
#336633 120°, 33%, 30% 20%, 40%, 20%
#336666 180°, 33%, 30% 20%, 40%, 40%
#336699 210°, 50%, 40% 20%, 40%, 60%
#3366CC 220°, 60%, 50% 20%, 40%, 80%
#3366FF 225°, 100%, 60% 20%, 40%, 100%
#339900 100°, 100%, 30% 20%, 60%, 0%
#339933 120°, 50%, 40% 20%, 60%, 20%
#339966 150°, 50%, 40% 20%, 60%, 40%
#339999 180°, 50%, 40% 20%, 60%, 60%
#3399CC 200°, 60%, 50% 20%, 60%, 80%
#3399FF 210°, 100%, 60% 20%, 60%, 100%
#33CC00 105°, 100%, 40% 20%, 80%, 0%
#33CC33 120°, 60%, 50% 20%, 80%, 20%
#33CC66 140°, 60%, 50% 20%, 80%, 40%
#33CC99 160°, 60%, 50% 20%, 80%, 60%
#33CCCC 180°, 60%, 50% 20%, 80%, 80%
#33CCFF 195°, 100%, 60% 20%, 80%, 100%
#33FF00 108°, 100%, 50% 20%, 100%, 0%
#33FF33 120°, 100%, 60% 20%, 100%, 20%
#33FF66 135°, 100%, 60% 20%, 100%, 40%
#33FF99 150°, 100%, 60% 20%, 100%, 60%
#33FFCC 165°, 100%, 60% 20%, 100%, 80%
#33FFFF 180°, 100%, 60% 20%, 100%, 100%
#660000 0°, 100%, 20% 40%, 0%, 0%
#660033 330°, 100%, 20% 40%, 0%, 20%
#660066 300°, 100%, 20% 40%, 0%, 40%
#660099 280°, 100%, 30% 40%, 0%, 60%
#6600CC 270°, 100%, 40% 40%, 0%, 80%
#6600FF 264°, 100%, 50% 40%, 0%, 100%
#663300 30°, 100%, 20% 40%, 20%, 0%
#663333 0°, 33%, 30% 40%, 20%, 20%
#663366 300°, 33%, 30% 40%, 20%, 40%
#663399 270°, 50%, 40% 40%, 20%, 60%
#6633CC 260°, 60%, 50% 40%, 20%, 80%
#6633FF 255°, 100%, 60% 40%, 20%, 100%
#666600 60°, 100%, 20% 40%, 40%, 0%
#666633 60°, 33%, 30% 40%, 40%, 20%
#666666 0°, 0%, 40% 40%, 40%, 40%
#666699 240°, 20%, 50% 40%, 40%, 60%
#6666CC 240°, 50%, 60% 40%, 40%, 80%
#6666FF 240°, 100%, 70% 40%, 40%, 100%
#669900 80°, 100%, 30% 40%, 60%, 0%
#669933 90°, 50%, 40% 40%, 60%, 20%
#669966 120°, 20%, 50% 40%, 60%, 40%
#669999 180°, 20%, 50% 40%, 60%, 60%
#6699CC 210°, 50%, 60% 40%, 60%, 80%
#6699FF 220°, 100%, 70% 40%, 60%, 100%
#66CC00 90°, 100%, 40% 40%, 80%, 0%
#66CC33 100°, 60%, 50% 40%, 80%, 20%
#66CC66 120°, 50%, 60% 40%, 80%, 40%
#66CC99 150°, 50%, 60% 40%, 80%, 60%
#66CCCC 180°, 50%, 60% 40%, 80%, 80%
#66CCFF 200°, 100%, 70% 40%, 80%, 100%
#66FF00 96°, 100%, 50% 40%, 100%, 0%
#66FF33 105°, 100%, 60% 40%, 100%, 20%
#66FF66 120°, 100%, 70% 40%, 100%, 40%
#66FF99 140°, 100%, 70% 40%, 100%, 60%
#66FFCC 160°, 100%, 70% 40%, 100%, 80%
#66FFFF 180°, 100%, 70% 40%, 100%, 100%
#990000 0°, 100%, 30% 60%, 0%, 0%
#990033 340°, 100%, 30% 60%, 0%, 20%
#990066 320°, 100%, 30% 60%, 0%, 40%
#990099 300°, 100%, 30% 60%, 0%, 60%
#9900CC 285°, 100%, 40% 60%, 0%, 80%
#9900FF 276°, 100%, 50% 60%, 0%, 100%
#993300 20°, 100%, 30% 60%, 20%, 0%
#993333 0°, 50%, 40% 60%, 20%, 20%
#993366 330°, 50%, 40% 60%, 20%, 40%
#993399 300°, 50%, 40% 60%, 20%, 60%
#9933CC 280°, 60%, 50% 60%, 20%, 80%
#9933FF 270°, 100%, 60% 60%, 20%, 100%
#996600 40°, 100%, 30% 60%, 40%, 0%
#996633 30°, 50%, 40% 60%, 40%, 20%
#996666 0°, 20%, 50% 60%, 40%, 40%
#996699 300°, 20%, 50% 60%, 40%, 60%
#9966CC 270°, 50%, 60% 60%, 40%, 80%
#9966FF 260°, 100%, 70% 60%, 40%, 100%
#999900 60°, 100%, 30% 60%, 60%, 0%
#999933 60°, 50%, 40% 60%, 60%, 20%
#999966 60°, 20%, 50% 60%, 60%, 40%
#999999 0°, 0%, 60% 60%, 60%, 60%
#9999CC 240°, 33%, 70% 60%, 60%, 80%
#9999FF 240°, 100%, 80% 60%, 60%, 100%
#99CC00 75°, 100%, 40% 60%, 80%, 0%
#99CC33 80°, 60%, 50% 60%, 80%, 20%
#99CC66 90°, 50%, 60% 60%, 80%, 40%
#99CC99 120°, 33%, 70% 60%, 80%, 60%
#99CCCC 180°, 33%, 70% 60%, 80%, 80%
#99CCFF 210°, 100%, 80% 60%, 80%, 100%
#99FF00 84°, 100%, 50% 60%, 100%, 0%
#99FF33 90°, 100%, 60% 60%, 100%, 20%
#99FF66 100°, 100%, 70% 60%, 100%, 40%
#99FF99 120°, 100%, 80% 60%, 100%, 60%
#99FFCC 150°, 100%, 80% 60%, 100%, 80%
#99FFFF 180°, 100%, 80% 60%, 100%, 100%
#CC0000 0°, 100%, 40% 80%, 0%, 0%
#CC0033 345°, 100%, 40% 80%, 0%, 20%
#CC0066 330°, 100%, 40% 80%, 0%, 40%
#CC0099 315°, 100%, 40% 80%, 0%, 60%
#CC00CC 300°, 100%, 40% 80%, 0%, 80%
#CC00FF 288°, 100%, 50% 80%, 0%, 100%
#CC3300 15°, 100%, 40% 80%, 20%, 0%
#CC3333 0°, 60%, 50% 80%, 20%, 20%
#CC3366 340°, 60%, 50% 80%, 20%, 40%
#CC3399 320°, 60%, 50% 80%, 20%, 60%
#CC33CC 300°, 60%, 50% 80%, 20%, 80%
#CC33FF 285°, 100%, 60% 80%, 20%, 100%
#CC6600 30°, 100%, 40% 80%, 40%, 0%
#CC6633 20°, 60%, 50% 80%, 40%, 20%
#CC6666 0°, 50%, 60% 80%, 40%, 40%
#CC6699 330°, 50%, 60% 80%, 40%, 60%
#CC66CC 300°, 50%, 60% 80%, 40%, 80%
#CC66FF 280°, 100%, 70% 80%, 40%, 100%
#CC9900 45°, 100%, 40% 80%, 60%, 0%
#CC9933 40°, 60%, 50% 80%, 60%, 20%
#CC9966 30°, 50%, 60% 80%, 60%, 40%
#CC9999 0°, 33%, 70% 80%, 60%, 60%
#CC99CC 300°, 33%, 70% 80%, 60%, 80%
#CC99FF 270°, 100%, 80% 80%, 60%, 100%
#CCCC00 60°, 100%, 40% 80%, 80%, 0%
#CCCC33 60°, 60%, 50% 80%, 80%, 20%
#CCCC66 60°, 50%, 60% 80%, 80%, 40%
#CCCC99 60°, 33%, 70% 80%, 80%, 60%
#CCCCCC 0°, 0%, 80% 80%, 80%, 80%
#CCCCFF 240°, 100%, 90% 80%, 80%, 100%
#CCFF00 72°, 100%, 50% 80%, 100%, 0%
#CCFF33 75°, 100%, 60% 80%, 100%, 20%
#CCFF66 80°, 100%, 70% 80%, 100%, 40%
#CCFF99 90°, 100%, 80% 80%, 100%, 60%
#CCFFCC 120°, 100%, 90% 80%, 100%, 80%
#CCFFFF 180°, 100%, 90% 80%, 100%, 100%
#FF0000 0°, 100%, 50% 100%, 0%, 0%
#FF0033 348°, 100%, 50% 100%, 0%, 20%
#FF0066 336°, 100%, 50% 100%, 0%, 40%
#FF0099 324°, 100%, 50% 100%, 0%, 60%
#FF00CC 312°, 100%, 50% 100%, 0%, 80%
#FF00FF 300°, 100%, 50% 100%, 0%, 100%
#FF3300 12°, 100%, 50% 100%, 20%, 0%
#FF3333 0°, 100%, 60% 100%, 20%, 20%
#FF3366 345°, 100%, 60% 100%, 20%, 40%
#FF3399 330°, 100%, 60% 100%, 20%, 60%
#FF33CC 315°, 100%, 60% 100%, 20%, 80%
#FF33FF 300°, 100%, 60% 100%, 20%, 100%
#FF6600 24°, 100%, 50% 100%, 40%, 0%
#FF6633 15°, 100%, 60% 100%, 40%, 20%
#FF6666 0°, 100%, 70% 100%, 40%, 40%
#FF6699 340°, 100%, 70% 100%, 40%, 60%
#FF66CC 320°, 100%, 70% 100%, 40%, 80%
#FF66FF 300°, 100%, 70% 100%, 40%, 100%
#FF9900 36°, 100%, 50% 100%, 60%, 0%
#FF9933 30°, 100%, 60% 100%, 60%, 20%
#FF9966 20°, 100%, 70% 100%, 60%, 40%
#FF9999 0°, 100%, 80% 100%, 60%, 60%
#FF99CC 330°, 100%, 80% 100%, 60%, 80%
#FF99FF 300°, 100%, 80% 100%, 60%, 100%
#FFCC00 48°, 100%, 50% 100%, 80%, 0%
#FFCC33 45°, 100%, 60% 100%, 80%, 20%
#FFCC66 40°, 100%, 70% 100%, 80%, 40%
#FFCC99 30°, 100%, 80% 100%, 80%, 60%
#FFCCCC 0°, 100%, 90% 100%, 80%, 80%
#FFCCFF 300°, 100%, 90% 100%, 80%, 100%
#FFFF00 60°, 100%, 50% 100%, 100%, 0%
#FFFF33 60°, 100%, 60% 100%, 100%, 20%
#FFFF66 60°, 100%, 70% 100%, 100%, 40%
#FFFF99 60°, 100%, 80% 100%, 100%, 60%
#FFFFCC 60°, 100%, 90% 100%, 100%, 80%
#FFFFFF 0°, 0%, 100% 100%, 100%, 100%
Читайте также:  Домашние цветы желтого цвета мелкие

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

Источник