Цветовой код | Креативы в Интернете
Если вы графический дизайнер или только что когда-либо работали в программе для редактирования изображений, вы наверняка заметили коробка, которая позволила вам изменить цвет, будь то ведро с краской, кисть, буквы … Что, возможно, вызвало у вас любопытство, так это тот факт, что когда вы выбираете цвет, он появляется цветовой код, знаете, что это такое?
Если вы когда-либо задавались вопросом, что означают эти буквенные или цифровые коды, и хотите узнать об этом больше, мы поможем вам понять важность цветового кода, почему они отражают цвета и другие любопытные детали.
Индекс
- 1 Какой цветовой код
- 1.1 Типы цветовых кодов
- 2 Почему коды важны?
- 3 Список цветов и их шестнадцатеричный и RGB код
Какой цветовой код
Мы можем определить цветовой код как цветовая гамма, в которой может отображаться Интернет.
Фактически, цветовой код предназначен для того, чтобы служить универсальным кодом для всех браузеров таким образом, что с помощью этих кодов достигается воспроизведение одних и тех же тонов либо в Internet Explores, либо в Firefox Mozilla, либо в Google Chrome. …
Подпишитесь на наш Youtube-канал
Вы должны знать, что компьютер способен различать до 16 миллионов цветов, так что есть много возможностей создать веб-сайт или изменить изображения.
Типы цветовых кодов
Как мы уже говорили вам ранее, существует три типа систем:
- RGB. Это наиболее известный цвет, состоящий из трех основных цветов: красного, синего и зеленого, из которых путем их сочетания и происходят остальные цвета. Что касается его представления, оно варьируется от 0 до 255, а отображаемый код состоит из трех цифр, разделенных запятыми и заключенных в круглые скобки.
- Шестнадцатеричный. Используется в основном в HTML и CSS. В этом случае он состоит из цифр и букв, которые расположены между собой для получения кодов, определяющих цвета.
- ХСЛ. Уже не используемый, он основан на использовании оттенка, насыщенности и яркости при создании цвета. Он определяется степенями и процентами (три цифры, разделенные запятыми и заключенные в круглые скобки).
Почему коды важны?
Теперь, когда вы знаете, что такое цветовое кодирование, его применение легко понять, поскольку он используется для определения того, какой код требуется для отображения определенного цвета. Это работает, например, на веб-страницах. HTML-код является неявным, если у веб-сайта есть фон определенного цвета, если шрифт красный, желтый, зеленый, синий … и многие другие варианты использования.
Вы понимаете, почему это важно? Например, представьте, что у вас есть веб-сайт с красным фоном. И вы хотите поменять его на пустой. Если бы вы знали код, определяющий красный цвет, используя поисковую систему в коде HTML, вы бы получили место, где этот цвет отражается (связанный с цветом фона), и вы могли бы быстро его изменить. Но что, если у вас его нет? Вам придется искать, пока не найдете этот раздел, и проверить, какой код близок к тому, который вам нужен.
Таким образом, цветовой код помогает ускорить работу, а также дает возможность использовать цвета при разработке веб-сайта, редактировании изображения и т. Д.
Список цветов и их код
Шестнадцатеричная и RGBНаконец, мы хотели бы оставить вас ниже таблица, в которой вы можете найти большинство существующих цветов вместе с их десятичным кодом (RGB) и шестнадцатеричным
так что если в любой момент вам понадобится изменить код, вы можете сделать это легко, не ища его в цветовой палитре.Этикетка | Десятичный (R, G, B) | Шестнадцатеричная |
---|---|---|
алиса синий | RGB (240, 248, 255) | # F0F8FF |
античный | RGB (250, 235, 215) | # FAEBD7 |
вода | RGB (0, 255, 255) | # 00FFFF |
Аквамарин | RGB (127, 255, 212) | # 7FFFD4 |
лазурь | RGB (240, 255, 255) | # F0FFFF |
бежевый | RGB (245, 245, 220) | # F5F5DC |
фора | RGB (255, 228, 196) | # FFE4C4 |
черный | RGB (0, 0, 0) | #000000 |
бланшированный миндаль | RGB (255, 235, 205) | #FFEBCD |
синий | RGB (0, 0, 255) | #0000FF |
сине-фиолетовый | RGB (138, 43, 226) | # 8A2BE2 |
коричневый | RGB (165, 42, 42) | # A52A2A |
burlywood | RGB (222, 184, 135) | # DEB887 |
cadetblue | RGB (95, 158, 160) | # 5F9EA0 |
картезианский монастырь | RGB (127, 255, 0) | # 7FFF00 |
шоколад | RGB (210, 105, 30) | # D2691E |
коралловый | RGB (255, 127, 80) | # FF7F50 |
васильковый | RGB (100, 149, 237) | # 6495ED |
кукурузные рыльца | RGB (255, 248, 220) | # FFF8DC |
малиновый | RGB (220, 20, 60) | # DC143C |
голубой | RGB (0, 255, 255) | # 00FFFF |
темно-синий | RGB (0, 0, 139) | #00008B |
темно-синий | RGB (0, 139, 139) | # 008B8B |
темный | RGB (184, 134, 11) | #B8860B |
темно-серый | RGB (169, 169, 169) | # A9A9A9 |
темно-зеленый | RGB (0, 100, 0) | #006400 |
темно-серый | RGB (169, 169, 169) | # A9A9A9 |
даркхаки | RGB (189, 183, 107) | # BDB76B |
темно-пурпурный | RGB (139, 0, 139) | # 8B008B |
темно-оливковый | RGB (85, 107, 47) | # 556B2F |
темно-оранжевый | RGB (255, 140, 0) | # FF8C00 |
темнокожий | RGB (153, 50, 204) | # 9932CC |
темно-красный | RGB (139, 0, 0) | #8B0000 |
темный лосось | RGB (233, 150, 122) | # E9967A |
темно-зеленый | RGB (143, 188, 143) | # 8FBC8F |
темно-синий | RGB (72, 61, 139) | # 483D8B |
темно-серый | RGB (47, 79, 79) | # 2F4F4F |
Darkslategrey | RGB (47, 79, 79) | # 2F4F4F |
темно-бирюзовый | RGB (0, 206, 209) | # 00CED1 |
темно-фиолетовый | RGB (148, 0, 211) | #9400D3 |
темно-розовый | RGB (255, 20, 147) | #FF1493 |
темно-синий | RGB (0, 191, 255) | # 00BFFF |
тусклый | RGB (105, 105, 105) | #696969 |
Димгрей | RGB (105, 105, 105) | #696969 |
голубой | RGB (30, 144, 255) | # 1E90FF |
огнеупорный кирпич | RGB (178, 34, 34) | #B22222 |
цветочный белый | RGB (255, 250, 240) | # FFFAF0 |
зеленый лес | RGB (34, 139, 34) | #228B22 |
фуксия | RGB (255, 0, 255) | # FF00FF |
Gainsboro | RGB (220, 220, 220) | #DCDCDC |
призрачный | RGB (248, 248, 255) | # F8F8FF |
золото | RGB (255, 215, 0) | # FFD700 |
золотарник | RGB (218, 165, 32) | # DAA520 |
серый | RGB (128, 128, 128) | #808080 |
зеленый | RGB (0, 128, 0) | #008000 |
желто-зеленый | RGB (173, 255, 47) | # ADFF2F |
серый | RGB (128, 128, 128) | #808080 |
нектар | RGB (240, 255, 240) | # F0FFF0 |
ярко-розовый | RGB (255, 105, 180) | # FF69B4 |
индийский | RGB (205, 92, 92) | # CD5C5C |
индиго | RGB (75, 0, 130) | #4B0082 |
цвета слоновой кости | RGB (255, 255, 240) | # FFFFF0 |
хаки | RGB (240, 230, 140) | # F0E68C |
лаванда | RGB (230, 230, 250) | # E6E6FA |
лаванда | RGB (255, 240, 245) | # FFF0F5 |
газон | RGB (124, 252, 0) | # 7CFC00 |
лимонный шифон | RGB (255, 250, 205) | #FFFACD |
светло-синий | RGB (173, 216, 230) | # ADD8E6 |
светло-коралловый | RGB (240, 128, 128) | #F08080 |
светло-голубой | RGB (224, 255, 255) | # E0FFFF |
светзолото-желтый | RGB (250, 250, 210) | # FAFAD2 |
светло-серый | RGB (211, 211, 211) | #D3D3D3 |
светло-зеленый | RGB (144, 238, 144) | # 90EE90 |
светло-серый | RGB (211, 211, 211) | #D3D3D3 |
светло-розовый | RGB (255, 182, 193) | # FFB6C1 |
светлый лосось | RGB (255, 160, 122) | # FFA07A |
свет | RGB (32, 178, 170) | # 20B2AA |
светнебосиний | RGB (135, 206, 250) | # 87CEFA |
свет | RGB (119, 136, 153) | #778899 |
свет | RGB (119, 136, 153) | #778899 |
светстальсиний | RGB (176, 196, 222) | # B0C4DE |
светло-желтый | RGB (255, 255, 224) | # FFFFE0 |
известь | RGB (0, 255, 0) | # 00FF00 |
LimeGreen | RGB (50, 205, 50) | # 32CD32 |
белье | RGB (250, 240, 230) | # FAF0E6 |
пурпурный | RGB (255, 0, 255) | # FF00FF |
темно-бордовый | RGB (128, 0, 0) | #800000 |
среднийаквамарин | RGB (102, 205, 170) | # 66CDAA |
RGB (0, 0, 205) | # 0000CD | |
среднеорхид | RGB (186, 85, 211) | # BA55D3 |
среднефиолетовый | RGB (147, 112, 219) | #9370D8 |
средний | RGB (60, 179, 113) | # 3CB371 |
средний | RGB (123, 104, 238) | # 7B68EE |
средний | RGB (0, 250, 154) | # 00FA9A |
средняя бирюза | RGB (72, 209, 204) | # 48D1CC |
среднийфиолетовый | RGB (199, 21, 133) | # C71585 |
темно-синий | RGB (25, 25, 112) | #191970 |
мятный крем | RGB (245, 255, 250) | # F5FFFA |
туманная роза | RGB (255, 228, 225) | # FFE4E1 |
мокасин | RGB (255, 228, 181) | # FFE4B5 |
навайовит | RGB (255, 222, 173) | #FFDEAD |
военно-морской флот | RGB (0, 0, 128) | #000080 |
старое платье | RGB (253, 245, 230) | # FDF5E6 |
оливки | RGB (128, 128, 0) | #808000 |
olivedrab | RGB (107, 142, 35) | # 6B8E23 |
оранжевый | RGB (255, 165, 0) | # FFA500 |
Оранжево-красный | RGB (255, 69, 0) | #FF4500 |
орхидея | RGB (218, 112, 214) | # DA70D6 |
бледно-золотистый | RGB (238, 232, 170) | # EEE8AA |
palegreen | RGB (152, 251, 152) | # 98FB98 |
поддон бирюза | RGB (175, 238, 238) | #АФЕЕЕЕЕЕЕЕЕЕЕЕЕЕЕЕЕЕЕЕЕЕЕЕЕЕЕТ |
бледно-фиолетовый | RGB (219, 112, 147) | # D87093 |
папайя | RGB (255, 239, 213) | # FFEFD5 |
персиковый | RGB (255, 218, 185) | # FFDAB9 |
Перу | RGB (205, 133, 63) | # CD853F |
розовый | RGB (255, 192, 203) | # FFC0CB |
слива | RGB (221, 160, 221) | # DDA0DD |
синий порошок | RGB (176, 224, 230) | # B0E0E6 |
фиолетовый | RGB (128, 0, 128) | #800080 |
красный | RGB (255, 0, 0) | #FF0000 |
розово-коричневый | RGB (188, 143, 143) | # BC8F8F |
Королевский синий | RGB (65, 105, 225) | # 4169E1 |
Saddlebrown | RGB (139, 69, 19) | #8B4513 |
лосось | RGB (250, 128, 114) | # FA8072 |
Sandybrown | RGB (244, 164, 96) | # F4A460 |
цвет морской волны | RGB (46, 139, 87) | # 2E8B57 |
морская ракушка | RGB (255, 245, 238) | # FFF5EE |
сиена | RGB (160, 82, 45) | # A0522D |
Серебряный | RGB (192, 192, 192) | # C0C0C0 |
голубое небо | RGB (135, 206, 235) | # 87CEEB |
slateblue | RGB (106, 90, 205) | # 6A5ACD |
шифер серый | RGB (112, 128, 144) | #708090 |
Slategrey | RGB (112, 128, 144) | #708090 |
снег | RGB (255, 250, 250) | #ФФФАФА |
весенне-зеленый | RGB (0, 255, 127) | # 00FF7F |
стальной синий | RGB (70, 130, 180) | #4682B4 |
загар | RGB (210, 180, 140) | # D2B48C |
чирок | RGB (0, 128, 128) | #008080 |
чертополох | RGB (216, 191, 216) | # D8BFD8 |
помидор | RGB (255, 99, 71) | #FF6347 |
бирюзовый | RGB (64, 224, 208) | # 40E0D0 |
фиолетовый | RGB (238, 130, 238) | # EE82EE |
пшеница | RGB (245, 222, 179) | # F5DEB3 |
белый | RGB (255, 255, 255) | #FFFFFF |
белый дым | RGB (245, 245, 245) | #F5F5F5 |
желтый | RGB (255, 255, 0) | # FFFF00 |
желтый зеленый | RGB (154, 205, 50) | # 9ACD32 |
Вы знаете больше цветовых кодов? Предлагаем вам разместить их в комментариях, чтобы расширить список.
Содержание статьи соответствует нашим принципам редакционная этика. Чтобы сообщить об ошибке, нажмите здесь.
Вы можете быть заинтересованы
Коды цветов html css палитра
HTML5CSS.ru
ЛУЧШИЙ САЙТ ДЛЯ РАЗРАБОТЧИКОВ
❮ Назад Дальше ❯
Имена цветов, отсортированные по цветным группам
Все современные браузеры поддерживают следующие 140 цветовых имен (нажмите на название цвета, или шестнадцатеричное значение, чтобы увидеть цвет как фон-цвет вместе с различными цветами текста):
Нажмите здесь, чтобы увидеть 140 цветов отсортированы по имени
Нажмите здесь, чтобы увидеть 140 цвета отсортированы по шестнадцатеричное значение
Розовые цвета html коды | ||||
Color Name | HEX | Color | Shades | Mix |
---|---|---|---|---|
Pink | #FFC0CB | Shades | Mix | |
LightPink | #FFB6C1 | Shades | Mix | |
HotPink | #FF69B4 | Shades | Mix | |
DeepPink | #FF1493 | Shades | Mix | |
PaleVioletRed | #DB7093 | Shades | Mix | |
MediumVioletRed | #C71585 | Shades | Mix | |
Фиолетовые цвета html коды | ||||
Color Name | HEX | Color | Shades | Mix |
Lavender | #E6E6FA | Shades | Mix | |
Thistle | #D8BFD8 | Shades | Mix | |
Plum | #DDA0DD | Shades | Mix | |
Orchid | #DA70D6 | Shades | Mix | |
Violet | #EE82EE | Shades | Mix | |
Fuchsia | #FF00FF | Shades | Mix | |
Magenta | #FF00FF | Shades | Mix | |
MediumOrchid | #BA55D3 | Shades | Mix | |
DarkOrchid | #9932CC | Shades | Mix | |
DarkViolet | #9400D3 | Shades | Mix | |
BlueViolet | #8A2BE2 | Shades | Mix | |
DarkMagenta | #8B008B | Shades | Mix | |
Purple | #800080 | Shades | Mix | |
MediumPurple | #9370DB | Shades | Mix | |
MediumSlateBlue | #7B68EE | Shades | Mix | |
SlateBlue | #6A5ACD | Shades | Mix | |
DarkSlateBlue | #483D8B | Shades | Mix | |
RebeccaPurple | #663399 | Shades | Mix | |
Indigo | #4B0082 | Shades | Mix | |
Красные цвета html коды | ||||
Color Name | HEX | Color | Shades | Mix |
LightSalmon | #FFA07A | Shades | Mix | |
Salmon | #FA8072 | Shades | Mix | |
DarkSalmon | #E9967A | Shades | Mix | |
LightCoral | #F08080 | Shades | Mix | |
IndianRed | #CD5C5C | Shades | Mix | |
Crimson | #DC143C | Shades | Mix | |
Red | #FF0000 | Shades | Mix | |
FireBrick | #B22222 | Shades | Mix | |
DarkRed | #8B0000 | Shades | Mix | |
Оранжевые цвета html коды | ||||
Color Name | HEX | Color | Shades | Mix |
Orange | #FFA500 | Shades | Mix | |
DarkOrange | #FF8C00 | Shades | Mix | |
Coral | #FF7F50 | Shades | Mix | |
Tomato | #FF6347 | Shades | Mix | |
OrangeRed | #FF4500 | Shades | Mix | |
Желтые цвета html коды | ||||
Color Name | HEX | Color | Shades | Mix |
Gold | #FFD700 | Shades | Mix | |
Yellow | #FFFF00 | Shades | Mix | |
LightYellow | #FFFFE0 | Shades | Mix | |
LemonChiffon | #FFFACD | Shades | Mix | |
LightGoldenRodYellow | #FAFAD2 | Shades | Mix | |
PapayaWhip | #FFEFD5 | Shades | Mix | |
Moccasin | #FFE4B5 | Shades | Mix | |
PeachPuff | #FFDAB9 | Shades | Mix | |
PaleGoldenRod | #EEE8AA | Shades | Mix | |
Khaki | #F0E68C | Shades | Mix | |
DarkKhaki | #BDB76B | Shades | Mix | |
Зеленые цвета html коды | ||||
Color Name | HEX | Color | Shades | Mix |
GreenYellow | #ADFF2F | Shades | Mix | |
Chartreuse | #7FFF00 | Shades | Mix | |
LawnGreen | #7CFC00 | Shades | Mix | |
Lime | #00FF00 | Shades | Mix | |
LimeGreen | #32CD32 | Shades | Mix | |
PaleGreen | #98FB98 | Shades | Mix | |
LightGreen | #90EE90 | Shades | Mix | |
MediumSpringGreen | #00FA9A | Shades | Mix | |
SpringGreen | #00FF7F | Shades | Mix | |
MediumSeaGreen | #3CB371 | Shades | Mix | |
SeaGreen | #2E8B57 | Shades | Mix | |
ForestGreen | #228B22 | Shades | Mix | |
Green | #008000 | Shades | Mix | |
DarkGreen | #006400 | Shades | Mix | |
YellowGreen | #9ACD32 | Shades | Mix | |
OliveDrab | #6B8E23 | Shades | Mix | |
DarkOliveGreen | #556B2F | Shades | Mix | |
MediumAquaMarine | #66CDAA | Shades | Mix | |
DarkSeaGreen | #8FBC8F | Shades | Mix | |
LightSeaGreen | #20B2AA | Shades | Mix | |
DarkCyan | #008B8B | Shades | Mix | |
Teal | #008080 | Shades | Mix | |
Голубые цвета html коды | ||||
Color Name | HEX | Color | Shades | Mix |
Aqua | #00FFFF | Shades | Mix | |
Cyan | #00FFFF | Shades | Mix | |
LightCyan | #E0FFFF | Shades | Mix | |
PaleTurquoise | #AFEEEE | Shades | Mix | |
Aquamarine | #7FFFD4 | Shades | Mix | |
Turquoise | #40E0D0 | Shades | Mix | |
MediumTurquoise | #48D1CC | Shades | Mix | |
DarkTurquoise | #00CED1 | Shades | Mix | |
Синие цвета html коды | ||||
Color Name | HEX | Color | Shades | Mix |
CadetBlue | #5F9EA0 | Shades | Mix | |
SteelBlue | #4682B4 | Shades | Mix | |
LightSteelBlue | #B0C4DE | Shades | Mix | |
LightBlue | #ADD8E6 | Shades | Mix | |
PowderBlue | #B0E0E6 | Shades | Mix | |
LightSkyBlue | #87CEFA | Shades | Mix | |
SkyBlue | #87CEEB | Shades | Mix | |
CornflowerBlue | #6495ED | Shades | Mix | |
DeepSkyBlue | #00BFFF | Shades | Mix | |
DodgerBlue | #1E90FF | Shades | Mix | |
RoyalBlue | #4169E1 | Shades | Mix | |
Blue | #0000FF | Shades | Mix | |
MediumBlue | #0000CD | Shades | Mix | |
DarkBlue | #00008B | Shades | Mix | |
Navy | #000080 | Shades | Mix | |
MidnightBlue | #191970 | Shades | Mix | |
Коричневые цвета html коды | ||||
Color Name | HEX | Color | Shades | Mix |
Cornsilk | #FFF8DC | Shades | Mix | |
BlanchedAlmond | #FFEBCD | Shades | Mix | |
Bisque | #FFE4C4 | Shades | Mix | |
NavajoWhite | #FFDEAD | Shades | Mix | |
Wheat | #F5DEB3 | Shades | Mix | |
BurlyWood | #DEB887 | Shades | Mix | |
Tan | #D2B48C | Shades | Mix | |
RosyBrown | #BC8F8F | Shades | Mix | |
SandyBrown | #F4A460 | Shades | Mix | |
GoldenRod | #DAA520 | Shades | Mix | |
DarkGoldenRod | #B8860B | Shades | Mix | |
Peru | #CD853F | Shades | Mix | |
Chocolate | #D2691E | Shades | Mix | |
Olive | #808000 | Shades | Mix | |
SaddleBrown | #8B4513 | Shades | Mix | |
Sienna | #A0522D | Shades | Mix | |
Brown | #A52A2A | Shades | Mix | |
Maroon | #800000 | Shades | Mix | |
Белые цвета html коды | ||||
Color Name | HEX | Color | Shades | Mix |
White | #FFFFFF | Shades | Mix | |
Snow | #FFFAFA | Shades | Mix | |
HoneyDew | #F0FFF0 | Shades | Mix | |
MintCream | #F5FFFA | Shades | Mix | |
Azure | #F0FFFF | Shades | Mix | |
AliceBlue | #F0F8FF | Shades | Mix | |
GhostWhite | #F8F8FF | Shades | Mix | |
WhiteSmoke | #F5F5F5 | Shades | Mix | |
SeaShell | #FFF5EE | Shades | Mix | |
Beige | #F5F5DC | Shades | Mix | |
OldLace | #FDF5E6 | Shades | Mix | |
FloralWhite | #FFFAF0 | Shades | Mix | |
Ivory | #FFFFF0 | Shades | Mix | |
AntiqueWhite | #FAEBD7 | Shades | Mix | |
Linen | #FAF0E6 | Shades | Mix | |
LavenderBlush | #FFF0F5 | Shades | Mix | |
MistyRose | #FFE4E1 | Shades | Mix | |
Зеленые цвета html коды | ||||
Color Name | HEX | Color | Shades | Mix |
Gainsboro | #DCDCDC | Shades | Mix | |
LightGray | #D3D3D3 | Shades | Mix | |
Silver | #C0C0C0 | Shades | Mix | |
DarkGray | #A9A9A9 | Shades | Mix | |
DimGray | #696969 | Shades | Mix | |
Gray | #808080 | Shades | Mix | |
LightSlateGray | #778899 | Shades | Mix | |
SlateGray | #708090 | Shades | Mix | |
DarkSlateGray | #2F4F4F | Shades | Mix | |
Black | #000000 | Shades | Mix |
❮ Назад Дальше ❯
PHP\CSS\JS\HMTL Editor
Как сделать
Вкладки
Выпадающие
Аккордеоны
Конвертер
Анимированные кнопки
Боковая Навигация
Верхняя навигация
Модальные коробки
Строки хода выполнения
Параллакс
Форма входа
HTML вставка
Google Карты
Ползунки диапазона
Подсказки
Слайдшоу
Список фильтров
Сортировать список
Еще »
Copyright 2018-2020 HTML5CSS. ru
Правила и Условия Политика конфиденциальности О нас Контакты
шестнадцатеричных цветовых кодов
шестнадцатеричных цветовых кодовШестнадцатеричный код: | Образец цвета: |
#70DB93 | . |
#5C3317 | . |
#000000 | . |
#0000FF | . |
#9F5F9F | . |
#B5A642 | . |
#D9D919 | . |
#8C7853 | . |
#A67D3D | . |
#A62A2A | . |
#5F9F9F | .![]() |
#D98719 | . |
#B87333 | . |
#42426F | . |
#00FFFF | . |
#5C4033 | . |
#2F4F2F | . |
#4A766E | . |
#4F4F2F | . |
#9932CD | . |
#871F78 | . |
#6B238E | . |
#2F4F4F | . |
#97694F | . |
#7093DB | . |
#855E42 | .![]() |
#545454 | . |
#856363 | . |
#D19275 | . |
#8E2323 | . |
#238E23 | . |
#CD7F32 | . |
#DBDB70 | . |
#00FF00 | . |
#527F76 | . |
#93DB70 | . |
#C0C0C0 | . |
#215E21 | . |
#4E2F2F | . |
#9F9F5F | . |
#C0D9D9 | .![]() |
#A8A8A8 | . |
#8F8FBD | . |
#E9C2A6 | . |
#32CD32 | . |
#FF00FF | . |
#E47833 | . |
#8E236B | . |
#32CD99 | . |
#3232CD | . |
#6B8E23 | . |
#EAEAAE | . |
#9370DB | . |
#426F42 | . |
#7F00FF | . |
#7FFF00 | .![]() |
#70DBDB | . |
#DB7093 | . |
#A68064 | . |
#2F2F4F | . |
#23238E | . |
#4D4DFF | . |
#FF6EC7 | . |
#00009C | . |
#EBC79E | . |
#CFB538 | . |
#FF7F00 | . |
#FF2400 | . |
#DB70DB | . |
#8FBC8F | . |
#BC8F8F | .![]() |
#EAADEA | . |
#D9D9F3 | . |
#FF0000 | . |
#5959AB | . |
#6F4242 | . |
#8C1717 | . |
#238E68 | . |
#6B4226 | . |
#8E6B23 | . |
#E6E8FA | . |
#3299CC | . |
#007FFF | . |
#FF1CAE | . |
#00FF7F | . |
#236B8E | .![]() |
#38B0DE | . |
#DB9370 | . |
#D8BFD8 | . |
#ADEAEA | . |
#CDCDCD | . |
#4F2F4F | . |
#CC3299 | . |
#D8D8BF | . |
#FFFFFF | . |
#FFFF00 | . |
#99CC32 | . |
Как читать шестнадцатеричные цветовые коды — шестнадцатеричный цвет
Перейти к содержимому Независимо от того, являетесь ли вы цифровым художником и работаете с Adobe Creative Suite, в 3D-приложении или в UX-дизайне, вы, вероятно, использовали шестнадцатеричные цвета. Но даже если вы используете шестнадцатеричный код каждый день, есть большая вероятность, что вы не совсем понимаете, что происходит с этими комбинациями букв и цифр. Вот тут-то и пригодится это удобное руководство по чтению шестнадцатеричных цветовых кодов.
Что такое шестнадцатеричный код?
Шестнадцатеричные цветовые коды — это один из типов цветового кода HTML, который часто называют шестнадцатеричным цветом или шестнадцатеричным кодом. Причиной использования шестнадцатеричных чисел является удобное представление значений в двоичном коде.
Что означают цифры и буквы в шестнадцатеричном коде?
Шестнадцатеричные цветовые коды начинаются со знака решетки или хэштега (#) и сопровождаются шестью буквами и/или цифрами. Первые две буквы/цифры относятся к красному цвету, следующие две — к зеленому, а последние две — к синему. Значения цвета определяются значениями от 00 до FF (вместо от 0 до 255 в RGB).
Числа используются, когда значение равно 1-9. Буквы используются, когда значение больше 9. Например:
A=10
В=11
С=12
Г=13
Е=14
F=15
Чтобы получить шестнадцатеричный цвет, выполните следующие три шага:
Умножьте первое число на 16.
Умножьте второе число на 1.
Сложите две суммы вместе.
Понимание Hex в RGB для контекста
Прежде чем переходить к чтению шестнадцатеричных цветовых кодов, неплохо начать с понимания того, как понимать цвета RGB. Числа RGB основаны на настройках монитора красного, зеленого и синего света. Изменяя числа RGB, вы сообщаете своему монитору, сколько именно этого цвета света вы хотите сиять.
Что такое цветовые коды RGB?
В цветовой системе RGB цвета представлены следующим образом:
RGB(255, 0, 0)
RGB определяет значения красного (первое число), зеленого (второе число) или синего (третье число). Число 0 означает отсутствие представления цвета, а 255 означает максимально возможную концентрацию цвета.
Итак, в приведенном выше примере вы получаете максимально яркий красный цвет без присутствия зеленого или синего. Если бы вам нужен был только зеленый, вы бы использовали RGB(0, 255, 0), а для синего — RGB(0, 0, 255). Для других цветов вы будете использовать комбинацию цветовых значений, чтобы добиться желаемого результата.
Разница между шестнадцатеричными цветовыми кодами и кодами RGB
Поняв, что означают числа в шестнадцатеричных цветовых кодах, вы сможете лучше предсказать, какой цвет вы можете увидеть. Между использованием шестнадцатеричного или RGB-цвета нет большой разницы, за исключением того, что в CSS можно также добавить альфа-значение, так что у вас действительно будет цвет RGBA.
Это может быть очень полезно, если вы хотите управлять непрозрачностью цвета. Добавление альфа-значения к вашему RGB, безусловно, является одним из самых простых способов изменить непрозрачность.
Как читать шестнадцатеричные коды цветов
Как только вы действительно поймете RGB, вы можете двигаться дальше и научиться читать шестнадцатеричные коды. Это действительно очень просто, если вы знаете формулу. Как упоминалось выше, значения 1-9 указаны в числовом виде. Однако для значений 10 и выше цифры заменяются буквами. Итак, А=10, В=11, С=12 и так далее.
Теперь, чтобы вычислить шестнадцатеричное число, есть три быстрых шага (как указано выше):
Умножьте первое число (или преобразованное число из буквы) на 16.
Умножьте второе число (или преобразованное число из буквы) на 1.
Сложите эти две суммы, чтобы получить одно значение.
Пример расчета шестнадцатеричного цветового кода
Например, шестнадцатеричное число для числа 83 на самом деле 131. Мы приходим к такому выводу:
Умножая 8 в 83 на 16 (8×16=128).
Умножение 3 в 83 на 1 (3×1=3).
Сложение двух итогов (128+3=131).
Другой способ представить это так:
(8×16) + (3×1) = 131
Работа с буквами — это та же концепция. Например, FF = 255, потому что вы умножаете число, представляющее F (15), на 16, а затем умножаете число, представляющее второе F (15), на 1. Затем сложите две суммы вместе, чтобы получить 255. Признайте, что число 255 такое же, как число RGB 255, которое является ярко-красным.
Если вы не хотите выполнять расчеты в уме, воспользуйтесь инструментом преобразования RGB в HEX.
Оценка шестнадцатеричных кодов в реальном мире
Как только вы поймете числа, вы сможете предсказать, как будет выглядеть цвет, основываясь на значениях интенсивности красного, зеленого и/или синего. Итак, если вы знаете, что максимальный красный цвет без зеленого или синего равен #FF0000, то вы можете мысленно немного изменить значения, чтобы получить оценку для другого цвета.
Другой пример шестнадцатеричного кода цвета — #7DD0D7, что дает вам зеленовато-синий цвет.
Общие преобразования Hex в RGB
Может быть полезно запомнить некоторые из наиболее распространенных шестнадцатеричных цветовых кодов не только тогда, когда вы хотите использовать именно эти цвета, но и для того, чтобы лучше предсказать, какими будут другие цвета при просмотре шестнадцатеричного цветового кода.
Красный = #FF0000 = RGB(255, 0, 0)
Зеленый = #008000 = RGB(1, 128, 0)
Синий = #0000FF = RGB(0, 0, 255)
Белый = #FFFFFF = RGB(255,255,255)
Цвет слоновой кости = #FFFFF0 = RGB(255, 255, 240)
Черный = #000000 = RGB(0, 0, 0)
Серый = #808080 = RGB(128, 128, 128)
Серебро = #C0C0C0 = RGB(192, 192, 192)
Желтый = #FFFF00 = RGB(255, 255, 0)
Фиолетовый = #800080 = RGB(128, 0, 128)
Оранжевый = FFA500 = RGB(255, 165, 0)
Бордовый = #800000 = RGB(128, 0, 0)
Фуксия = #FF00FF = RGB(255, 0, 255)
Салатовый = #00FF00 = RGB(0, 255, 0)
Цвет морской волны = #00FFFF = RGB(0, 255, 255)
Бирюзовый = #008080 = RGB(0, 128, 128)
Олива = #808000 = RGB(128, 128, 0)
Темно-синий = #000080 = RGB(0, 0, 128)
Найдите другие шестнадцатеричные коды цветов или выберите цвет HTML и получите его совпадающее имя и коды.
Помимо шестнадцатеричных цветовых кодов: выбор цветовой схемы
Самый быстрый способ выбрать цветовую схему для вашего проекта — использовать инструмент цветовой палитры, который позволяет вам искать группы по: как и что хорошо смотрятся вместе.
Выбрав цветовую схему, вы можете:
Создать коллаж
Исследование и создание градиента
Проверьте контрасты
Настройка оттенка, насыщенности, яркости и температуры
Каждому цвету присваивается шестнадцатеричный цветовой код, который вы можете использовать. В конце концов, у вас будет собственная цветовая схема, которая идеально олицетворяет ваш проект.
Но прежде чем выбрать палитру, запомните следующие советы по цветовому дизайну:
Учитывайте контекст.
См. цветовой круг.
Выберите монохроматическую, триадную или разделенную комплементарную цветовую схему.
Не ограничивайтесь пресетами.
Часто задаваемые вопросы о шестнадцатеричных кодах цветов
Мы знаем, что у вас есть еще вопросы о шестнадцатеричных цветах, поэтому мы создали этот краткий раздел часто задаваемых вопросов.
Что означает «гекс»?
Hex — это сокращение от Hexa, что в переводе с греческого означает шесть.
Когда мне следует конвертировать шестнадцатеричный формат в RGB (или наоборот)?
Хотя обе системы работают, согласованность имеет первостепенное значение. При разработке для определенного бренда проверьте их руководство по бренду, чтобы узнать, какой системе следовать, и соответствующим образом преобразовать цвета.
Как получить шестнадцатеричный код цвета для цвета изображения?
Существует множество бесплатных онлайн-инструментов для выбора цвета, которые позволяют очень легко получить шестнадцатеричный код цвета для определенного изображения.
Как правило, все, что вам нужно сделать, это либо вставить URL-адрес изображения, либо загрузить свое изображение в инструмент выбора цвета и выбрать цветовой пиксель. Вы получите шестнадцатеричный код цвета и значения RGB.
Как изменить шестнадцатеричный цвет в Adobe Illustrator?
Чтобы изменить шестнадцатеричный цвет в Adobe Illustrator, выполните следующие действия:
В новом документе Illustrator нажмите F6.
Дважды щелкните поле обводки или заливки в окне «Цвет».
Дважды щелкните внутри поля рядом с #.
Введите в поле новый шестнадцатеричный код цвета.
Нажмите OK.
Шестнадцатеричные инструменты цвета в этом руководстве
В этом руководстве мы предоставили вам множество полезных инструментов, поэтому они снова собраны в одном месте:
Инструмент для преобразования шестнадцатеричного формата в RGB
Цветовые коды HTML
Другая таблица цветовых кодов HTML
Инструмент цветовой палитры
Советы по цветному дизайну
Палитра цветов
Шестнадцатеричный инструмент цвета CSS
Обертывание шестнадцатеричных цветовых кодов
В заключение несколько напоминаний:
Типы цветов Hex и RGB предназначены для использования на экране при разработке веб-сайтов.
В CSS можно добавить альфа-значение для управления непрозрачностью цвета.
Для бренда ключевое значение имеет постоянство цвета.
Всегда стремитесь узнать больше о своей работе, просматривая ресурсы и посещая курсы, предлагаемые Pluralsight!
С помощью плана Pluralsight вы можете:
С помощью 30-дневного пилотного проекта вы можете:
- Доступ к тысячам видеороликов для развития важнейших навыков
- Предоставьте до 10 пользователей доступ к тысячам видеокурсов
- Практика и применение навыков с интерактивными курсами и проектами
- Просмотр данных о навыках, использовании и тенденциях для ваших команд
- Подготовьтесь к сертификации с помощью лучших в отрасли практических экзаменов
- Измерение уровня владения навыками и ролями
- Согласуйте обучение с вашими целями с помощью путей и каналов
Готовы повысить уровень
всей своей команды?
10
Подписки
Нужно больше подписок? Свяжитесь с отделом продаж.