Таблица цветов html
Обновлено: Опубликовано: Александр
Здравствуйте, друзья!
Представляю Вашему вниманию необходимую каждому веб-мастеру таблицу html — цветов, ещё ее называют таблицей безопасных цветов с HEX и RGB обозначениями цветов.
Как я уже упоминал в первых уроках, посвященных HTML, важное значение имеет кроссбраузерность сайта, именно поэтому в сайтостроении и дизайне следует придерживаться цветов, представленных в таблице ниже.
Преимущество данных цветов в том, что они будут отображаться такими, какие они есть на самом деле в любом браузере, в то время, как цвет вне данного списка, может интерпретироваться браузерами, в силу технических особенностей последних, по-разному, например, где-то фиолетовый, где-то розовый, где-то сиреневый, а где-то вообще непонятно какой.
Читать RGB — код следует именно в порядке букв: R — первое число до точки, G — второе число до точки и B — третье число кода.
Таблица из 216 цветов, представленная ниже, содержит только те цвета, которые гарантированно будут отображаться правильно. Поэтому данные цвета называют безопасными — Вы не опасаетесь передать читателям Вашего сайта цвет, который у Вас был одним, а у них станет другим.
Используйте цвета HTML от Nejalko.ru для текстов, графики, фона, и они всегда будут выглядеть так, как должны!
Верхнее цифровое значение — это безопасные HTML — цвета или HEX — код, спокойно распознаваемый веб-приложениями.
Нижнее значение — это RGB — код для графических редакторов.
Для Вашего удобства, HTML-цвета представлены сразу со знаком «#», то есть их сразу можно копировать и вставлять в HTML — код:
| #000000 0.0.0 | #000033 0.0.51 | #000066 0.  0.102 | #000099 0.0.153 | #0000CC 0.0.204 | #0000FF 0.0.255 |
| #003300 0.51.0 | #003333 0.51.51 | #003366 0.51.102 | #003399 0.51.153 | #0033CC 0.51.204 | #0033FF 0.51.255 |
| #006600 0.102.0 | #006633 0.102.51 | #006666 0.102.102 | #006699 0.102.153 | #0066CC 0.102.204 | #0066FF 0.102.255 |
| #009900 0.  153.0 | #009933 0.153.51 | #009966 0.153.102 | #009999 0.153.153 | #0099CC 0.153.204 | #0099FF 0.153.255 |
| #00CC00 0.204.0 | #00CC33 0.204.51 | #00CC66 0.204.102 | #00CC99 0.204.153 | #00CCCC 0.204.204 | #00CCFF 0.204.255 |
| #00FF00 0.255.0 | #00FF33 0.255.51 | #00FF66 0.255.102 | #00FF99 0.255.153 | #00FFCC 0.  255.204 | #00FFFF 0.255.255 |
| #330000 51.0.0 | #330033 51.0.51 | #330066 51.0.102 | #330099 51.0.153 | #3300CC 51.0.204 | #3300FF 51.0.255 |
| #333300 51.51.0 | 51.51.51 | #333366 51.51.102 | #333399 51.51.153 | #3333CC 51.51.204 | #3333FF 51.51.255 |
| #336600 51.102.0 | #336633 51.102.51 | #336666 51.  102.102 | #336699 51.102.153 | #3366CC 51.102.204 | #3366FF 51.102.255 |
| #339900 51.153.0 | #339933 51.153.51 | #339966 51.153.102 | #339999 51.153.153 | #3399CC 51.153.204 | #3399FF 51.153.255 |
| #33CC00 51.204.0 | #33CC33 51.204.51 | #33CC66 51.204.102 | #33CC99 51.204.153 | #33CCCC 51.204.204 | #33CCFF 51.204.255 |
| #33FF00 51.  255.0 | #33FF33 51.255.51 | #33FF66 51.255.102 | #33FF99 51.255.153 | 51.255.204 | #33FFFF 51.255.255 |
| #660000 102.0.0 | #660033 102.0.51 | #660066 102.0.102 | #660099 102.0.153 | #6600CC 102.0.204 | #6600FF 102.0.255 |
| #663300 102.51.0 | #663333 102.51.51 | #663366 102.51.102 | #663399 102.51.153 | #6633CC 102.  51.204 | #6633FF 102.51.255 |
| #666600 102.102.0 | #666633 102.102.51 | #666666 102.102.102 | #666699 102.102.153 | #6666CC 102.102.204 | #6666FF 102.102.255 |
| #669900 102.153.0 | #669933 102.153.51 | #669966 102.153.102 | #669999 102.153.153 | #6699CC 102.153.204 | #6699FF 102.153.255 |
| #66CC00 102.204.0 | #66CC33 102.  | #66CC66 102.204.102 | #66CC99 102.204.153 | #66CCCC 102.204.204 | #66CCFF 102.204.255 |
| #66FF00 102.255.0 | #66FF33 102.255.51 | #66FF66 102.255.102 | #66FF99 102.255.153 | #66FFCC 102.255.204 | #66FFFF 102.255.255 |
| #990000 153.0.0 | #990033 153.0.51 | #990066 153.0.102 | #990099 153.0.153 | #9900CC 153.0.204 | #9900FF 153.  0.255 |
| #993300 153.51.0 | #993333 153.51.51 | #993366 153.51.102 | #993399 153.51.153 | #9933CC 153.51.204 | #9933FF 153.51.255 |
| #996600 153.102.0 | #996633 153.102.51 | #996666 153.102.102 | #996699 153.102.153 | #9966CC 153.102.204 | #9966FF 153.102.255 |
| #999900 153.153.0 | #999933 153.153.102 | #999966 153.  153.51 | #999999 153.153.153 | #9999CC 153.153.204 | #9999FF 153.153.255 |
| #99CC00 153.204.0 | #99CC33 153.204.51 | #99CC66 153.204.102 | #99CC99 153.204.153 | #99CCCC 153.204.204 | #99CCFF 153.204.255 |
| #99FF00 153.255.0 | #99FF33 153.255.51 | #99FF66 153.255.102 | #99FF99 153.255.153 | #99FFCC 153.255.204 | #99FFFF 153.  255.255 |
| #CC0000 204.0.0 | #CC0033 204.0.51 | #CC0066 204.0.102 | #CC0099 204.0.153 | #CC00CC 204.0.204 | #CC00FF 204.0.255 |
| #CC3300 204.51.0 | #CC3333 204.51.51 | #CC3366 204.51.102 | #CC3399 204.51.153 | #CC33CC 204.51.204 | #CC33FF 204.51.255 |
| #CC6600 204.102.0 | #CC6633 204.102.51 | #CC6666 204.102.102 | #CC6699 204.  102.153 | #CC66CC 204.102.204 | #CC66FF 204.102.255 |
| #CC9900 204.153.0 | #CC9933 204.153.51 | #CC9966 204.153.102 | #CC9999 204.153.153 | #CC99CC 204.153.204 | #CC99FF 204.153.255 |
| #CCCC00 204.204.0 | #CCCC33 204.204.51 | #CCCC66 204.204.102 | #CCCC99 204.204.153 | #CCCCCC 204.204.204 | #CCCCFF 204.204.255 |
| #CCFF00 204.  255.0 | #CCFF33 204.255.51 | #CCFF66 204.255.102 | #CCFF99 204.255.153 | #CCFFCC 204.255.204 | #CCFFFF 204.255.255 |
| #FF0000 255.0.0 | #FF0033 255.0.51 | #FF0066 255.0.102 | #FF0099 255.0.153 | #FF00CC 255.0.204 | #FF00FF 255.0.255 |
| #FF3300 255.51.0 | #FF3333 255.51.51 | #FF3366 255.51.102 | #FF3399 255.51.153 | #FF33CC 255.  51.204 | #FF33FF 255.51.255 |
| #FF6600 255.102.0 | #FF6633 255.102.51 | #FF6666 255.102.102 | #FF6699 255.102.153 | #FF66CC 255.102.204 | #FF66FF 255.102.255 |
| #FF9900 255.153.0 | #FF9933 255.153.51 | #FF9966 255.153.102 | #FF9999 255.153.153 | #FF99CC 255.153.204 | #FF99FF 255.153.255 |
| #FFCC00 255.204.0 | #FFCC33 255.  204.51 | #FFCC66 255.204.102 | #FFCC99 255.204.153 | #FFCCCC 255.204.204 | #FFCCFF 255.204.255 |
| #FFFF00 255.255.0 | #FFFF33 255.255.51 | #FFFF66 255.255.102 | #FFFF99 255.255.153 | #FFFFCC 255.255.204 | #FFFFFF 255.255.255 |
Поделиться в соцсетях
Еще материалы по теме:
Таблица безопасных цветов – Дизайн та розробка сайту
Думаю, Вы знаете, что цветов очень много, и все могут быть использованы веб-мастерами. При верстке используют палитру в формате HEX или RGB.
Любой из этих форматов способен вывести в html любой цвет, но иногда бывает такое, что браузер не увидит какой-то цвет и автоматически подберет ближайший безопасный.
Если Вы хотите, чтобы такое не случилось с посетителями Вашего сайта, то можете использовать цвета из таблицы ниже. HEX цвета выглядят как 6 цифр или букв перед которыми стоит Знак решетки, например — #ff3300 — оранжевый цвет. RGB — это три числа, разделенные точками. Каждое число это степень заливки трех основных цветов — Red, Green, Blue(красный, зеленый, синий). Например, тот же оранжевый будет иметь такой вот код — 255.51.0.
Каким форматом пользоваться решать Вам, но все таки основной формат, это HEX. В таблице, что расположена ниже, представлены оба варианта с примером. Сначала RGB код, под ним HEX и уже под ними пример цвета.
В общем пользуйтесь и радуйтесь :).
|
255.204
153.102
0.0
102.153
51.204
0.153
102.204
102.204
0.51
204.255
255.255
153.102
255.204
204.0
0
255.255На этом все, спасибо за внимание. 🙂
Таблица цветов | HTML-цвета
Таблица цветов | HTML-цвета#ffebee
#ffcdd2
#ef9a9a
#e57373
#ef5350
#f44336
#e5 3935
#d32f2f
#c62828
#b71c1c
#ff8a80
#ff5252
#ff1744
#d50000
#fce4ec
#f8bbd0
#f48fb1
#f06292
#ec407a
#e91e63
#d81b60
#c2185b
#ad1457
#880e4f
#ff80ab
#ff4081
#f50057
# c51162
#f3e5f5
#e1bee7
#ce93d8
#ba68c8
#ab47bc
#9c27b0
#8e24aa
#7b1fa2
#6a1b9a
#4a148c
#ea80fc
#e040fb 90 004
#d500f9
#aa00ff
#ede7f6
#d1c4e9
#b39ddb
#9575cd
#7e57c2
#673ab7
#5e35b1
#512da8
#4527a0
9000 3 #311b92#b388ff
#7c4dff
#651fff
#6200ea
#e8eaf6
#c5cae9
#9fa8da
#7986cb
#5c6bc0
#3f51b5
#3949ab
#303f9f 9000 4
#283593
#1a237e
#8c9eff
#536dfe
#3d5afe
#304ffe
#e3f2fd
#bbdefb
#90caf9
#64b5f6
#42a5f5
# 2196f3
#1e88e5
#1976d2
#1565c0
#0d47a1
#82b1ff
#448aff
#2979ff
#2962ff
#e1f5fe
#b3e5fc
#81d4fa
#4fc3f7
#29b6f6
#03a9f4
#039be5
#0288d1
#0277bd
#01579b
#80d8ff
#40c4ff
#00b0ff
#0091ea
#e0f7fa
#b 2ebf2
#80deea
#4dd0e1
#26c6da
#00bcd4
#00acc1
#0097a7
#00838f
#006064
#84ffff
#18ffff
#00e5ff
#00b8d4
#e0f2f1
#b2dfdb
#80cbc4
#4db6ac
#26a69a
#009688
#00897b
#00796b
#00695c
#004d40
#a7ffeb
90 003 #64ffda#1de9b6
#00bfa5
#e8f5e9
#c8e6c9
#a5d6a7
1b5 e20#b9f6ca
#69f0ae
#00e676
#00c853
#f1f8e9
#dcedc8
#c5e1a5
#aed581
#9ccc65
#8bc34a
#7cb342
#689f38
#558b2f
#33691e
#ccff90
#b2ff59
#76ff03
#64dd17
#f9fbe7
#f0f4c3
#e6ee9c
#dce775
#d4e157
#cddc39
#c0ca33
#afb42b
#9e9d24
#827717
#f4ff81
#eeff41
#c6ff00
#aeea00
#fffde7
#fff9c4
#fff59d
#fff176
#ffee58
#ffeb3b
#fdd835
#fbc02d
#f9a825
#f57f17
#ffff8d
#ffff00
#ffea00
#ffd600
#fff8e1
#ffecb3
9000 3 #ffe082#ffd54f
#ffca28
#ffc107
#ffb300
#ffa000
#ff8f00
#ff6f00
#ffe57f
#ffd740
#ffc400
#ffab 00
#fff3e0
#ffe0b2
#ffcc80
#ffb74d
#ffa726
#ff9800
#fb8c00
#f57c00
#ef6c00
#e65100
#ffd180
#ffab40
#ff9100
#ff6d00
#fbe9e7
#ffccbc
#ffab91
#ff8a65
#ff7043
#ff5722
#f4511e
#e64a19
#d84315
90 003 #bf360c#ff9e80
#ff6e40
#ff3d00
#dd2c00
#efebe9
#d7ccc8
#bcaaa4
#a1887f
#8d6e63
#795548
#6d4c41
#5d4 037
#4e342e
#3e2723
#757575
#616161
#424242
#212121
#f5f5f5
#e0e0e0
#bdbdbd
#9e9e9e
#eceff1
#cfd8dc
#b0bec5
#90a4ae
#78909c
#607d8b
#546e7a
#455a64
#37474f
#263238
HEX
{{ hex }}
RGB
{{ rgbval }}
HSL
{{ hsl }}
Html Цвет Диаграмма
У нас есть сотни цветовых комбинаций! Посетите нашу страницу с цветовой диаграммой, чтобы получить вдохновение.
Изучите цвета плоского дизайна, дизайн Google Material, плавные цвета, схему дизайна в метро, все с цветовыми кодами HEX и RGB.
HEX
{{ hex }}
RGB
{{ rgbval }}
HSL 905 09
{{ hsl }}
Таблица безопасных цветов для Интернета
Палитра из 216 цветов. В старые добрые времена это были единственные цвета, которые браузеры могли отображать.
HEX
{{ hex }}
RGB
{{ rgbval }}
HSL 9050 9
{{ hsl }}
Таблица цветов для дизайна материалов
Материальный интерфейс разработан Google. Вы можете найти эту цветовую схему во всех приложениях Android и на веб-сайтах Google.
Инструменты, которые могут вам помочь!
Flat UI Colors Fluent Colors Metro Colors Flat Colors Web Safe Colors
ПОДЕЛИТЕСЬ С ДРУЗЬЯМИ!
| Цвет Плакат 18 x 24 дюйма Оригинал цвет- расположение колес, симметричное по оттенку каждая серия затенения по прямой ДОБАВИТЬ В КОРЗИНУ 15 $ КРУПНЫЙ ПЛАН… «…потрясающе « «. «… лучшая сеть | Цвет Таблица 18 x 24 дюйма Самый большой цвет, самая большая печать образцы макета, цветовая слепота ссылка ДОБАВИТЬ В КОРЗИНУ 15 $ КРУПНЫЙ ПЛАН… «Они очень | Цвет Таблица килограммов 18″x24″ «Небезопасный» цветовая схема! 1068 коды (только десятичные, подробнее) много пастель и земля тона для Интернета и графический дизайн ДОБАВИТЬ В КОРЗИНУ 15 $ КРУПНЫЙ ПЛАН. «Это великолепно «Это Мы (один раз | Цвет Подушка 8,1 x 8,1 дюйма квадрат мышь коврик, образцы макет ДОБАВИТЬ В КОРЗИНУ 15 $ КРУПНЫЙ ПЛАН… «похоже на «трепет- | Цвет Шестигранник 8,1 x 9,4 дюйма шестигранник мышь коврик ДОБАВИТЬ В КОРЗИНУ 15 $ КРУПНЫЙ ПЛАН. Оставить комментарий
|
..использовать почти 
.. 