Разное

Сочетание цветов html: Правильное сочетание цветов

13.11.2017

Правильное сочетание цветов

У Вас в браузере заблокирован JavaScript. Разрешите JavaScript для работы сайта!

Правильное сочетание цветов

Правильное сочетание 30 цветов: от белого до чёрного.

  1. Белый сочетается со всеми цветами. Наилучшее сочетание с синим, красным и черным.
    #FFFFFF
    #0000FF#FF0000#000000
  2. Бежевый сочетается с голубым, коричневым, изумрудным, черным, красным.
    #F5F5DC
    #00BFFF#A52A2A#50C878#FF0000
  3. Серый (базовый цвет) сочетается с «капризными» цветами: фуксия, красный, фиолетовый, розовый, синий.
    #808080
    #FF00FF#FF0000#8B00FF#FFC0CB#0000FF
  4. Розовый сочетается с коричневым, зеленой мятой, оливковым, серым, бирюзовым, светло-голубым.
    #FFC0CB
    #A52A2A#98FF98#808000#808080#30D5C8#E0FFFF
  5. Фуксия сочетается с серым, желто-коричневым, зеленым лаймом, зеленой мятой, коричневым.
    #FF00FF
    #808080#D2B48C#32CD32#98FF98#A52A2A
  6. Красный сочетается с желтым, бурым, зеленым, синим, черным.
    #FF0000
    #FFFF00
    #45161C#008000#0000FF#000000
  7. Томатно–красный сочетается с голубым, зеленой мятой, песочным, сливочно–белым, серым.
    #EC2D01
    #00BFFF#98FF98#FCDD76#FDF4E3#808080
  8. Вишнево-красный сочетается с лазурным, серым, светло-оранжевым, песочным, бледно-желтым, бежевым.
    #911E42
    #007FFF#808080#FFA000#FCDD76#FDEAA8#F5F5DC
  9. Малиново-красный сочетается с белым, черным и дамасской розой.
    #DC143C
    #FFFFFF#000000#FF4364
  10. Коричневый сочетается с ярко-голубым, кремовым, розовым, палевым, зеленым, бежевым.
    #A52A2A
    #00FFFF#FFFDD0#FFC0CB#FFF9D0#008000#F5F5DC
  11. Светло-коричневый сочетается с бледно-желтым, кремовым, синим, зеленым, пурпурным, красным.
    #CD853F
    #FDEAA8#FFFDD0#0000FF#008000#C5007F#FF0000
  12. Темно-коричневый сочетается с лимонно-желтым, голубым, зеленой мятой, пурпурно-розовым, зеленым лаймом.
    #654321
    #FFF44F#00BFFF#98FF98#FF99CC#32CD32
  13. Рыжевато-коричневый сочетается с розовым, темно-коричневым, синим, зеленым, пурпурным.
    #B7410E
    #FFC0CB#654321#0000FF#008000#C5007F
  14. Оранжевый сочетается с голубым, синим, лиловым, фиолетовым.
    #FF8000
    #00BFFF#0000FF#CC99FE#8B00FF
  15. Светло–оранжевый сочетается с серым, коричневым, оливковым.
    #FFA000
    #808080#A52A2A#808000
  16. Темно–оранжевый сочетается с бледно–желтым, оливковым, коричневым, вишнёвым.
    #FF5300
    #FDEAA8#808000#A52A2A#911E42
  17. Желтый сочетается с синим, лиловым, светло-голубым, фиолетовым, серым, черным.
    #FFFF00
    #0000FF#CC99FE#E0FFFF#8B00FF#808080#000000
  18. Лимонно-желтый сочетается с вишнево-красным, коричневым, синим, серым.
    #FFF44F
    #911E42#A52A2A#0000FF#808080
  19. Бледно-желтый сочетается с фуксией, серым, коричневым, красным, желтовато-коричневым, синим, пурпурным.
    #FDEAA8
    #FF00FF#808080#A52A2A#FF0000#CC7722#0000FF#C5007F
  20. Золотисто-желтый сочетается с серым, коричневым, лазурным, красным.
    #FFD700
    #808080#A52A2A#007FFF#FF0000
  21. Оливковый сочетается с апельсиновым, светло-коричневым, коричневым.
    #808000
    #FF8800#CD853F#A52A2A
  22. Зеленый сочетается с золотисто-коричневым, оранжевым, салатовым, желтым, коричневым, серым, кремовым, черным, сливочно-белым.
    #008000
    #DAA520#FF8000#7FFF00#FFFF00#A52A2A#808080#FFFDD0#000000#FDF4E3
  23. Салатовый цвет сочетается с коричневым, желтовато-коричневым, палевым, серым, темно-синим, красным.
    #7FFF00
    #A52A2A#CC7722#FFF9D0#808080#000080#FF0000
  24. Бирюзовый сочетается с фуксией, вишнево-красным, желтым, коричневым, кремовым, темно-фиолетовым.
    #30D5C8
    #FF00FF#911E42#FFFF00#A52A2A#FFFDD0#800080
  25. Электрик сочетается с золотисто-желтым, коричневым, светло-коричневым, серым, серебряным.
    #2C75FF
    #FFD700#A52A2A#CD853F#808080#C0C0C0
  26. Голубой сочетается с красным, серым, коричневым, оранжевым, розовым, желтым.
    #00BFFF
    #FF0000#808080#A52A2A#FF8000#FFC0CB#FFFF00
  27. Темно-синий сочетается с светло-лиловым, голубым, желтовато-зеленым, коричневым, серым, бледно-желтым, оранжевым, зеленым, красным.
    #000080
    #DCD0FF#00BFFF#ADFF2F#A52A2A#808080#FDEAA8#FF8000#008000#FF0000
  28. Лиловый сочетается с оранжевым, розовым, темно-фиолетовым, оливковым, серым, желтым.
    #CC99FE
    #FF8000#FFC0CB#800080#808000#808080#FFFF00
  29. Темно-фиолетовый сочетается с золотисто-коричневым, бледно-желтым, серым, бирюзовым, зеленой мятой, светло-оранжевым.
    #800080
    #DAA520#FDEAA8#808080#30D5C8#98FF98#FFA000
  30. Черный универсален, сочетается со всеми цветами. Наилучшее сочетание с оранжевым, розовым, салатовым, красным, сиреневым, желтым, белым.
    #000000
    #FF8000#FFC0CB#7FFF00#FF0000#C8A2C8#FFFF00#FFFFFF

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

Подбор цветов и генерация цветовых схем

Монохроматическая модель. Эта цветовая схема основана на одном оттенке цвета, и использует вариации, сделанные только лишь изменением насыщенности и яркости.

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

Также монохроматические вариации сделаны для каждого цвета в других схемах.

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

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

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

Триада образована тремя цветами, равномерно распределяя цветовой круг (120°). Цветовые схемы триады имеют много возможностей по сочетанию цветов, регулировке контраста, акцентов и баланса теплых/холодных цветов.

Модель цветовой тетрады (двойной контраст). Эта цветовая схема образована парой цветов и их контрастов. Она основана на Тетраде — четверке цветов, равномерно распределенных по цветовому кругу (90°). Тетрада — очень агрессивная цветовая схема, требующая хорошего планирования и деликатный подход к отношениям этих цветов.

Меньшая дистанция между цветами вызывает в результате меньше напряжения. Тем не менее, тетрада всегда является более «нервной» и «вызывающей», чем другие цветовые схемы. Работая с ней, вы должны заботиться о связях между одним цветом и его смежным дополнительным цветом (комплементом). В случае тетрады (угол 90°), необходимо хорошее чувство цвета и очень деликатный подход к сочетанию цветов.

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

Вы можете задать дистанцию смежных (вторичных) цветов, угол не должен превышать 60°.

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

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

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

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

Оттенок основного цвета. Чтобы изменить значения, перетащите ползунок по цветовому кругу. Для ввода числового значения, дважды кликните по нему.

Оттенок дополнительного цвета. Чтобы изменить значения, перетащите ползунок по цветовому кругу. Для ввода числового значения, дважды кликните по нему.

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

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

Значение оттенка основного цвета. Кликните для ввода числового значения.

Угол/дистанция оттенка вторичных цветов. Кликните для ввода числового значения. Имеет смысл только в цветовых схемах, использующих вторичные цвета.

Значение RGB основного цвета. Кликните для ввода числового значения.

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

Значения RGB основного цвета.

Пресеты цветовых схем. Кликните и выберите предопределенные комбинации яркости, насыщенности и контрастности цветовой схемы.

Яркость и Насыщенность. Перетаскивайте ползунок по квадрату для регулировки яркости (вверх = светлее, вниз = темнее) и насыщенности (вправо = насыщенное, влево = разбавленное).

Контрастность цветовой схемы. Перетаскивайте ползунок по квадрату для регулировки контрастности вариантов цвета в схеме (вверх/вниз для темного варианта, влево/вправо для светлого варианта).

Контрастность цветовой схемы. Панель для регулировки яркости и насыщенности сразу всех вариантов схемы.

Коррекция Вариантов. Панель для регулировки яркости и насыщенности по отдельности для каждого цвета.

Список вариантов цвета. Выберите вариант цвета, а затем отрегулируйте его насыщенность и яркость при помощи ползунка на левом квадрате.

Схема палитры. Представлены четыре основных цвета, для легкого составления впечатления о схеме.

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

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

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

Пример веб-страницы (светлая/позитив). Кликните чтобы посмотреть пример веб-страницы, созданной при помощи текущей цветовой схемы. Это только пример, цвета палитры могут использоваться в сотнях разных вариаций.

Пример веб-страницы (темная/негатив). Кликните чтобы посмотреть пример веб-страницы, созданной при помощи текущей цветовой схемы. Это только пример, цвета палитры могут использоваться в сотнях разных вариаций.

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

Рандомизация. Служит для создания случайной палитры согласно настройкам рандомизации.

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

Цвета HTML. Таблица из 147 имён цветов для HTML и CSS — ColorScheme.Ru
HTML Имя ЦветаHEXRGB
Красные тона:
IndianRed#CD5C5C205, 92, 92
LightCoral#F08080240, 128, 128
Salmon#FA8072250, 128, 114
DarkSalmon#E9967A233, 150, 122
LightSalmon#FFA07A255, 160, 122
Crimson#DC143C220, 20, 60
Red#FF0000255, 0, 0
FireBrick#B22222178, 34, 34
DarkRed#8B0000139, 0, 0
Розовые тона:
Pink#FFC0CB255, 192, 203
LightPink#FFB6C1255, 182, 193
HotPink#FF69B4255, 105, 180
DeepPink#FF1493255, 20, 147
MediumVioletRed#C71585199, 21, 133
PaleVioletRed#DB7093219, 112, 147
Оранжевые тона:
LightSalmon#FFA07A255, 160, 122
Coral#FF7F50255, 127, 80
Tomato#FF6347255, 99, 71
OrangeRed#FF4500255, 69, 0
DarkOrange#FF8C00255, 140, 0
Orange#FFA500255, 165, 0
Жёлтые тона:
Gold#FFD700255, 215, 0
Yellow#FFFF00255, 255, 0
LightYellow#FFFFE0255, 255, 224
LemonChiffon#FFFACD255, 250, 205
LightGoldenrodYellow#FAFAD2250, 250, 210
PapayaWhip#FFEFD5255, 239, 213
Moccasin#FFE4B5255, 228, 181
PeachPuff#FFDAB9255, 218, 185
PaleGoldenrod#EEE8AA238, 232, 170
Khaki#F0E68C240, 230, 140
DarkKhaki#BDB76B189, 183, 107
Фиолетовые тона:
Lavender#E6E6FA230, 230, 250
Thistle#D8BFD8216, 191, 216
Plum#DDA0DD221, 160, 221
Violet#EE82EE238, 130, 238
Orchid#DA70D6218, 112, 214
Fuchsia#FF00FF255, 0, 255
Magenta#FF00FF255, 0, 255
MediumOrchid#BA55D3186, 85, 211
MediumPurple#9370DB147, 112, 219
BlueViolet#8A2BE2138, 43, 226
DarkViolet#9400D3148, 0, 211
DarkOrchid#9932CC153, 50, 204
DarkMagenta#8B008B139, 0, 139
Purple#800080128, 0, 128
Indigo#4B008275, 0, 130
SlateBlue#6A5ACD106, 90, 205
DarkSlateBlue#483D8B72, 61, 139
Коричневые тона:
Cornsilk#FFF8DC255, 248, 220
BlanchedAlmond#FFEBCD255, 235, 205
Bisque#FFE4C4255, 228, 196
NavajoWhite#FFDEAD255, 222, 173
Wheat#F5DEB3245, 222, 179
BurlyWood#DEB887222, 184, 135
Tan#D2B48C210, 180, 140
RosyBrown#BC8F8F188, 143, 143
SandyBrown#F4A460244, 164, 96
Goldenrod#DAA520218, 165, 32
DarkGoldenRod#B8860B184, 134, 11
Peru#CD853F205, 133, 63
Chocolate#D2691E210, 105, 30
SaddleBrown#8B4513139, 69, 19
Sienna#A0522D160, 82, 45
Brown#A52A2A165, 42, 42
Maroon#800000128, 0, 0
Основные цвета:
Black#0000000, 0, 0
Gray#808080128, 128, 128
Silver#C0C0C0192, 192, 192
White#FFFFFF255, 255, 255
Fuchsia#FF00FF255, 0, 255
Purple#800080128, 0, 128
Red#FF0000255, 0, 0
Maroon#800000128, 0, 0
Yellow#FFFF00255, 255, 0
Olive#808000128, 128, 0
Lime#00FF000, 255, 0
Green#0080000, 128, 0
Aqua#00FFFF0, 255, 255
Teal#0080800, 128, 128
Blue#0000FF0, 0, 255
Navy#0000800, 0, 128
HTML Имя ЦветаHEXRGB
Зелёные тона:
GreenYellow#ADFF2F173, 255, 47
Chartreuse#7FFF00127, 255, 0
LawnGreen#7CFC00124, 252, 0
Lime#00FF000, 255, 0
LimeGreen#32CD3250, 205, 50
PaleGreen#98FB98152, 251, 152
LightGreen#90EE90144, 238, 144
MediumSpringGreen#00FA9A0, 250, 154
SpringGreen#00FF7F0, 255, 127
MediumSeaGreen#3CB37160, 179, 113
SeaGreen#2E8B5746, 139, 87
ForestGreen#228B2234, 139, 34
Green#0080000, 128, 0
DarkGreen#0064000, 100, 0
YellowGreen#9ACD32154, 205, 50
OliveDrab#6B8E23107, 142, 35
Olive#808000128, 128, 0
DarkOliveGreen#556B2F85, 107, 47
MediumAquamarine#66CDAA102, 205, 170
DarkSeaGreen#8FBC8F143, 188, 143
LightSeaGreen#20B2AA32, 178, 170
DarkCyan#008B8B0, 139, 139
Teal#0080800, 128, 128
Синие тона:
Aqua#00FFFF0, 255, 255
Cyan#00FFFF0, 255, 255
LightCyan#E0FFFF224, 255, 255
PaleTurquoise#AFEEEE175, 238, 238
Aquamarine#7FFFD4127, 255, 212
Turquoise#40E0D064, 224, 208
MediumTurquoise#48D1CC72, 209, 204
DarkTurquoise#00CED10, 206, 209
CadetBlue#5F9EA095, 158, 160
SteelBlue#4682B470, 130, 180
LightSteelBlue#B0C4DE176, 196, 222
PowderBlue#B0E0E6176, 224, 230
LightBlue#ADD8E6173, 216, 230
SkyBlue#87CEEB135, 206, 235
LightSkyBlue#87CEFA135, 206, 250
DeepSkyBlue#00BFFF0, 191, 255
DodgerBlue#1E90FF30, 144, 255
CornflowerBlue#6495ED100, 149, 237
MediumSlateBlue#7B68EE123, 104, 238
RoyalBlue#4169E165, 105, 225
Blue#0000FF0, 0, 255
MediumBlue#0000CD0, 0, 205
DarkBlue#00008B0, 0, 139
Navy#0000800, 0, 128
MidnightBlue#19197025, 25, 112
Белые тона:
White#FFFFFF255, 255, 255
Snow#FFFAFA255, 250, 250
Honeydew#F0FFF0240, 255, 240
MintCream#F5FFFA245, 255, 250
Azure#F0FFFF240, 255, 255
AliceBlue#F0F8FF240, 248, 255
GhostWhite#F8F8FF248, 248, 255
WhiteSmoke#F5F5F5245, 245, 245
Seashell#FFF5EE255, 245, 238
Beige#F5F5DC245, 245, 220
OldLace#FDF5E6253, 245, 230
FloralWhite#FFFAF0255, 250, 240
Ivory#FFFFF0255, 255, 240
AntiqueWhite#FAEBD7250, 235, 215
Linen#FAF0E6250, 240, 230
LavenderBlush#FFF0F5255, 240, 245
MistyRose#FFE4E1255, 228, 225
Серые тона:
Gainsboro#DCDCDC220, 220, 220
LightGrey#D3D3D3211, 211, 211
LightGray#D3D3D3211, 211, 211
Silver#C0C0C0192, 192, 192
DarkGray#A9A9A9169, 169, 169
DarkGrey#A9A9A9169, 169, 169
Gray#808080128, 128, 128
Grey#808080128, 128, 128
DimGray#696969105, 105, 105
DimGrey#696969105, 105, 105
LightSlateGray#778899119, 136, 153
LightSlateGrey#778899119, 136, 153
SlateGray#708090112, 128, 144
SlateGrey#708090112, 128, 144
DarkSlateGray#2F4F4F47, 79, 79
DarkSlateGrey#2F4F4F47, 79, 79
Black#0000000, 0, 0
Выбор правильного сочетания для вашего сайта / Хабр Цвет, безусловно, является важным источником эмоции. Цвета могут устанавливать правильный тон и передавать необходимые эмоции посетителям, могут взволновать, вызвать множество чувств и стимулировать к действиям. Он является чрезвычайно мощным фактором воздействия на пользователей.

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

Итак, приступим к знакомству с магией цвета…

Цветовая теория: основные принципы. Умение сочетать цвета

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

Рассмотрим цветовой круг.

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

Цветовой круг является непременным атрибутом многих дизайнеров и художников по всему миру. Это идеальное доказательства теории, что гениальное всегда просто. Круг позволяет вам выбрать цвета, которые гармонировали бы вместе. Он состоит из 6 основных цветов: красный, оранжевый, желтый, зеленый, синий, фиолетовый и дополнительных цветов.
Чтобы найти правильную цветовою схему, необходимо использовать любые два цвета друг напротив друга, любые три цвета на равном расстоянии при формировании треугольника или любой из четырех цветов, образующих прямоугольник (две пары цвета друг напротив друга). Цветовые схемы остаются правильными независимо от угла поворота.

Основные цвета
Есть три основных цвета: красный (# ff0000 в HTML или # F00 в CSS), желтый (# FFFF00 в HTML или # ff0 в CSS) и голубой (# 0000FF в HTML или # 00f в CSS). Нельзя их получить путем смешивания других цветов. Дополнительные цвета могут быть сформированы путем объединения этих трех цветов.

Составные цвета
Есть также три основных: оранжевый (# ff9900 в HTML или # F90 в CSS), зеленый (# 00FF00 в HTML или # 0f0 в CSS) и фиолетовый (# FF00FF в HTML или # f0f в CSS). Вы можете получить их путем смешивания красного и желтого(оранжевого), желтого и синего (зеленый) и синего и красного (фиолетовый).

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

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

Аналогичные цвета
Эти цвета расположены рядом друг с другом на цветовом круге. Они обычно смотрят очень хорошо вместе. Использование таких цветовых сочетаний вызывает чувство комфортa у посетителей Вашего сайта.

Цвета в разных культурах: символизм

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

  • Китай: цвет невесты, удачи, торжества
  • Индия: чистота
  • Южная Африка: траурные цвета
  • Восток: радость (в сочетании с белым)
  • Запад: возбуждение, любовь, страсть
  • США: рождество (с зеленым), день святого Валентина (с белым)
  • Иврит: жертва, грех
  • Япония: жизнь
  • Христианство: жертва, страсть, любовь
  • Фэн-шуй: Янь, огонь, удача, уважение, защита, живучесть, деньги, признание

Голубой

  • Европа: успокоение
  • Иран: траур, цвет неба и духовность
  • Китай: бессмертие
  • Индуизм: цвет Кришны
  • Иудаизм: святость
  • Христианство: цвет Христа
  • Католицизм: цвета одежды Марии
  • Ближний Восток: защита
  • В мире: цвет безопасности
  • Фэн-шуй: Инь, вода, спокойствие, любовь, исцеление, релаксация, доверие, приключения
  • Запад: печаль, депрессия

Желтый

  • Европа: счастье, надежда, радость, трусость в опасностях, слабость
  • Азия: цвет имперского
  • Египет: траур
  • Япония: мужество
  • Индия: торговцы
  • Буддизм: мудрость
  • Фэн-шуй: Янь, Земля, благоприятный, солнечные лучи, тепло, движение

Оранжевый

  • Европа: осень, урожай, творчество
  • Ирландия: протестанты (религиозные)
  • США: Хэллоуин (с черным), дешевые товары
  • Индуизм: шафран (персиковый оранжевый) священный цвет
  • Фэн-шуй: Янь, Земля, цели, усиливает концентрацию

Коричневый

  • Колумбия: препятствие продажам
  • Австралийские аборигены: цвета земли, торжественное охра
  • Фэн-шуй: Янь, Земля, промышленность

Зеленый

  • Япония: жизнь
  • Ислам: надежда, добродетель
  • Ирландия: символ всей страны
  • Европа / США: весна, новое рождение, День Святого Патрика, Рождество (с красным)
  • США: деньги
  • Индия: Ислам
  • Фэн-шуй: Инь, дерево, исцеление, здоровье, успокаивающее

Фиолетовый

  • Таиланд: траур (вдовы)
  • Католицизм: смерть, траур, распятие
  • Фэн-шуй: Инь, цвет физического и психического исцеления

Белый

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

Черный

  • Европа: траур, похороны, смерть, бунт, спокойствие
  • Таиланд: несчастье, зло
  • Иудаизм: несчастье, зло
  • Австралийские аборигены: цвет людей
  • Фэн-шуй: Инь, вода, деньги, успех в карьере, доход, стабильность, эмоциональная защита, сила

Значение цветов

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

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

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

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

Бодрость и творчество. Ассоциируется с дружелюбием, уверенностью, игривостью, мужеством, стойкостью.
Фиолетовый

Традиционно ассоциируется с властью, благородством и богатством. Мудрость, независимость, благородство, роскошь, честолюбие, достоинство, магия и тайны.
Зеленый

Цвет гармонии, природы, исцеления, жизни, питания и здоровья. Кроме того, часто связан с деньгами.
Коричневый

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

Вызывает чувство серьезности, консерватизма и традиционализма. Возбуждает ощущение чистоты и невинности.
Розовый

Выражает нежность, романтичность, женственность, пассивность, привязанность, воспитание, слабость.
Черный

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

Белый связан с чистотой, простотой, свежестью, добротой, невинностью.
Заключение

Существуют некоторые полезные советы, которые помогут Вам в выборе правильной цветовой схемы для вашего сайта. Эти маленькие советы широко используют профессиональные web-дизайнеры.
  1. Если вы хотите, чтобы текстовое содержимое, было легко читаемым, выбирайте контрастные цвета.
  2. Оптимальное количество цветов. Не делайте из Вашего сайта цирк.
  3. Используйте необходимое количество цветов. Минимальное количество цветов, может способствовать серости Вашего сайта.
  4. Если вам нужно привлечь посетителя, применяйте интенсивные цвета.
  5. Вы можете найти дополнительные цветовые схемы приобщаясь чаще к природе.

Полезные ссылки по теме:

Источник: Colors in Web Design: Choosing a right combination for your Website

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

Цвета для веб-дизайна играют огромную роль. Чтобы грамотно подобрать цветовую схему для сайта, существуют специальные сервисы. Уверена, что у каждого веб-дизайнера в закладках есть хотя бы один такой.

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

Я не буду рассказывать про теорию цвета (это слишком объемная информация), а просто опубликую здесь сервисы, которые есть у меня в закладках и которыми я пользуюсь .

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

colorscheme.ru

С этим инструментом я дружу уже много лет. Наиболее удобный инструмент для подбора цветов (на мой взгляд). У него много дополнительных возможностей. Например можно посмотреть пример светлой и темной страницы с выбранными цветами.

Есть возможность оценить, как будут видеть вашу цветовую гамму люди с дальтонизмом и другими особенностями зрения. Можно выбрать безопасные веб-цвета.

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

 

color.adobe.com

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

Для этого надо нажать кнопку в левом верхнем меню «Смотреть». И перед вами откроется галерея всевозможных цветовых сочетаний.

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

 

paletton.com

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

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

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

 

Следующие два сайта генерируют палитру из выбранного вами изображения.  It is magic 🙂

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

Color Palette Generator

На этом сайте необходимо указать ссылку на изображение.

degraeve

 

palettegenerator.com

На этот сайт нужно загрузить картинку со своего компьютера.

palettegenerator

 

palettable.io

Очень удобный инструмент для подбора цвета. Основан на принципе «Нравится — Не нравится».

palettable.io

 

flatcolors.net

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

http://flatcolors.net/palettes.php

 

materialpalette.com

Еще один модный тренд —  материал дизайн. Данный сайт помогает подобрать сочетания цветов для UI (user interface). Дополнительно на сайте есть большой набор иконок.

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

 

getuicolors.com

И напоследок снова user interface.  Здесь просто набор цветов для UI дизайна. Нажав на любой цвет, можно посмотреть как на определенном фоне будет читаться белый текст.

getuicolors

Вот такие инструменты есть у меня в закладках.

Напишите в комментариях, какими сайтами подбора цвета для веб-дизайна пользуетесь вы?

Нужен сайт с правильными цветами? Пишите, сделаем 🙂

Нашли ошибку? Выделите фрагмент текста и нажмите CTRL+ENTER

HTML цвета

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

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

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

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

Красные
Имя цветаHEXRGB
IndianRed#CD5C5Crgb(205, 92, 92)
LightCoral#F08080rgb(240, 128, 128)
Salmon#FA8072rgb(250, 128, 114)
DarkSalmon#E9967Argb(233, 150, 122)
LightSalmon#FFA07Argb(255, 160, 122)
Crimson#DC143Crgb(220, 20, 60)
Red#FF0000rgb(255, 0, 0)
FireBrick#B22222rgb(178, 34, 34)
DarkRed#8B0000rgb(139, 0, 0)
Жёлтые
Имя цветаHEXRGB
Gold#FFD700rgb(255, 215, 0)
Yellow#FFFF00rgb(255, 255, 0)
LightYellow#FFFFE0rgb(255, 255, 224)
LemonChiffon#FFFACDrgb(255, 250, 205)
LightGoldenrodYellow#FAFAD2rgb(250, 250, 210)
PapayaWhip#FFEFD5rgb(255, 239, 213)
Moccasin#FFE4B5rgb(255, 228, 181)
PeachPuff#FFDAB9rgb(255, 218, 185)
PaleGoldenrod#EEE8AArgb(238, 232, 170)
Khaki#F0E68Crgb(240, 230, 140)
DarkKhaki#BDB76Brgb(189, 183, 107)
Оранжевые
Имя цветаHEXRGB
Coral#FF7F50rgb(255, 127, 80)
Tomato#FF6347rgb(255, 99, 71)
OrangeRed#FF4500rgb(255, 69, 0)
DarkOrange#FF8C00rgb(255, 140, 0)
Orange#FFA500rgb(255, 165, 0)
Розовые
Имя цветаHEXRGB
Pink#FFC0CBrgb(255, 192, 203)
LightPink#FFB6C1rgb(255, 182, 193)
HotPink#FF69B4rgb(255, 105, 180)
DeepPink#FF1493rgb(255, 20, 147)
MediumVioletRed#C71585rgb(199, 21, 133)
PaleVioletRed#DB7093rgb(219, 112, 147)
Фиолетовые
Имя цветаHEXRGB
Lavender#E6E6FArgb(230, 230, 250)
Thistle#D8BFD8rgb(216, 191, 216)
Plum#DDA0DDrgb(221, 160, 221)
Violet#EE82EErgb(238, 130, 238)
Orchid#DA70D6rgb(218, 112, 214)
Fuchsia(Magenta)#FF00FFrgb(255, 0, 255)
MediumOrchid#BA55D3rgb(186, 85, 211)
MediumPurple#9370DBrgb(147, 112, 219)
BlueViolet#8A2BE2rgb(138, 43, 226)
DarkViolet#9400D3rgb(148, 0, 211)
DarkOrchid#9932CCrgb(153, 50, 204)
DarkMagenta#8B008Brgb(139, 0, 139)
Purple#800080rgb(128, 0, 128)
Indigo#4B0082rgb(75, 0, 130)
SlateBlue#6A5ACDrgb(106, 90, 205)
DarkSlateBlue#483D8Brgb(72, 61, 139)
Коричневые
Имя цветаHEXRGB
Cornsilk#FFF8DCrgb(255, 248, 220)
BlanchedAlmond#FFEBCDrgb(255, 235, 205)
Bisque#FFE4C4rgb(255, 228, 196)
NavajoWhite#FFDEADrgb(255, 222, 173)
Wheat#F5DEB3rgb(245, 222, 179)
BurlyWood#DEB887rgb(222, 184, 135)
Tan#D2B48Crgb(210, 180, 140)
RosyBrown#BC8F8Frgb(188, 143, 143)
SandyBrown#F4A460rgb(244, 164, 96)
Goldenrod#DAA520rgb(218, 165, 32)
DarkGoldenrod#B8860Brgb(184, 134, 11)
Peru#CD853Frgb(205, 133, 63)
Chocolate#D2691Ergb(210, 105, 30)
SaddleBrown#8B4513rgb(139, 69, 19)
Sienna#A0522Drgb(160, 82, 45)
Brown#A52A2Argb(165, 42, 42)
Maroon#800000rgb(128, 0, 0)
Синие
Имя цветаHEXRGB
Aqua(Cyan)#00FFFFrgb(0, 255, 255)
LightCyan#E0FFFFrgb(224, 255, 255)
PaleTurquoise#AFEEEErgb(175, 238, 238)
Aquamarine#7FFFD4rgb(127, 255, 212)
Turquoise#40E0D0rgb(64, 224, 208)
MediumTurquoise#48D1CCrgb(72, 209, 204)
DarkTurquoise#00CED1rgb(0, 206, 209)
CadetBlue#5F9EA0rgb(95, 158, 160)
SteelBlue#4682B4rgb(70, 130, 180)
LightSteelBlue#B0C4DErgb(176, 196, 222)
PowderBlue#B0E0E6rgb(176, 224, 230)
LightBlue#ADD8E6rgb(173, 216, 230)
SkyBlue#87CEEBrgb(135, 206, 235)
LightSkyBlue#87CEFArgb(135, 206, 250)
DeepSkyBlue#00BFFFrgb(0, 191, 255)
DodgerBlue#1E90FFrgb(30, 144, 255)
CornflowerBlue#6495EDrgb(100, 149, 237)
MediumSlateBlue#7B68EErgb(123, 104, 238)
RoyalBlue#4169E1rgb(65, 105, 225)
Blue#0000FFrgb(0, 0, 255)
MediumBlue#0000CDrgb(0, 0, 205)
DarkBlue#00008Brgb(0, 0, 139)
Navy#000080rgb(0, 0, 128)
MidnightBlue#191970rgb(25, 25, 112)
Имя цветаHEXRGB
Зелёные
GreenYellow#ADFF2Frgb(173, 255, 47)
Chartreuse#7FFF00rgb(127, 255, 0)
LawnGreen#7CFC00rgb(124, 252, 0)
Lime#00FF00rgb(0, 255, 0)
LimeGreen#32CD32rgb(50, 205, 50)
PaleGreen#98FB98rgb(152, 251, 152)
LightGreen#90EE90rgb(144, 238, 144)
MediumSpringGreen#00FA9Argb(0, 250, 154)
SpringGreen#00FF7Frgb(0, 255, 127)
MediumSeaGreen#3CB371rgb(60, 179, 113)
SeaGreen#2E8B57rgb(46, 139, 87)
ForestGreen#228B22rgb(34, 139, 34)
Green#008000rgb(0, 128, 0)
DarkGreen#006400rgb(0, 100, 0)
YellowGreen#9ACD32rgb(154, 205, 50)
OliveDrab#6B8E23rgb(107, 142, 35)
Olive#808000rgb(128, 128, 0)
DarkOliveGreen#556B2Frgb(85, 107, 47)
MediumAquamarine#66CDAArgb(102, 205, 170)
DarkSeaGreen#8FBC8Frgb(143, 188, 143)
LightSeaGreen#20B2AArgb(32, 178, 170)
DarkCyan#008B8Brgb(0, 139, 139)
Teal#008080rgb(0, 128, 128)
Белые
Имя цветаHEXRGB
White#FFFFFFrgb(255, 255, 255)
Snow#FFFAFArgb(255, 250, 250)
Honeydew#F0FFF0rgb(240, 255, 240)
MintCream#F5FFFArgb(245, 255, 250)
Azure#F0FFFFrgb(240, 255, 255)
AliceBlue#F0F8FFrgb(240, 248, 255)
GhostWhite#F8F8FFrgb(248, 248, 255)
WhiteSmoke#F5F5F5rgb(245, 245, 245)
Seashell#FFF5EErgb(255, 245, 238)
Beige#F5F5DCrgb(245, 245, 220)
OldLace#FDF5E6rgb(253, 245, 230)
FloralWhite#FFFAF0rgb(255, 250, 240)
Ivory#FFFFF0rgb(255, 255, 240)
AntiqueWhite#FAEBD7rgb(250, 235, 215)
Linen#FAF0E6rgb(250, 240, 230)
LavenderBlush#FFF0F5rgb(255, 240, 245)
MistyRose#FFE4E1rgb(255, 228, 225)
Серые
Имя цветаHEXRGB
Gainsboro#DCDCDC(220, 220, 220)
LightGray#D3D3D3rgb(211, 211, 211)
Silver#C0C0C0rgb(192, 192, 192)
DarkGray#A9A9A9rgb(169, 169, 169)
Gray#808080rgb(128, 128, 128)
DimGray#696969rgb(105, 105, 105)
LightSlateGray#778899rgb(119, 136, 153)
SlateGray#708090rgb(112, 128, 144)
DarkSlateGray#2F4F4Frgb(47, 79, 79)
Black#000000rgb(0, 0, 0)
Безопасные цвета для Веб. Таблица из 216 цветов, рекомендуемых для экранного дизайна — ColorScheme.Ru

· Инструмент для подбора цветов и генерации цветовых схем ·

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

Если веб-браузер не в состоянии правильно отобразить тот или иной цвет, то он пытается подобрать похожий или смешивает несколько соседних цветов. Может так случиться, что исходный цвет будет замещён чем-то совершенно неподходящим.

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

Безопасные цвета были выведены математически, а не потому, что они кому-то больше пришлись по душе. Для получения безопасного цвета из Красного, Зелёного и Синего, нужно использовать только данные десятичные значения: 0, 51, 102, 153, 204, 255 — и никакие другие. Каждое из трёх шестнадцатеричных значений не должно отличаться от 00, 33, 66, 99, CC, FF.

Таблица Безопасных Веб-цветов

Палитра состоит из 216 безопасных веб-цветов. Под каждым цветом указаны два значения — RGB, для создания цвета в графическом редакторе, и его шестнадцатеричных HEX-код, для обозначения цвета в HTML.

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

Комбинации цветовых схем

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

Цветовые схемы

Цветовые схемы

Цветовые схемы — это логические комбинации цветов на цветовом круге.

Целью цветовой схемы является создание эстетического чувства стиля и обжалованию.


Ахроматические Цветовые схемы

Черный текст на белом фоне.

Белый текст на черном фоне.

Черно-белая ахроматическая цветовая схема является цветовой схемой по умолчанию для веб-страницы.

Ахроматическая цветовая схема белого цвета на черном часто предпочтительнее для небольших устройств.

Белое на черном требует меньше энергии (увеличивает время автономной работы) в большинстве технологий отображения.


однотонные цветовые схемы

Монохроматические цветовые схемы легко создавать, поскольку они используют только один цвет.

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

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


Аналогичные цветовые схемы

Аналогичные цветовые схемы также легко создавать.

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

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


Дополнительные цветовые схемы


Triadic


Составная (иначе называемая Сплит) Цветовая схема

Составные схемы почти такие же, как дополнительные схемы.

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

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


,
Тестер комбинаций цветов — комбинированный тестер

Выберите ComboColorCombo1ColorCombo2ColorCombo3ColorCombo4ColorCombo5ColorCombo6ColorCombo7ColorCombo8ColorCombo9ColorCombo10ColorCombo11ColorCombo12ColorCombo13ColorCombo14ColorCombo15ColorCombo16ColorCombo17ColorCombo18ColorCombo19ColorCombo20ColorCombo21ColorCombo22ColorCombo23ColorCombo24ColorCombo25ColorCombo26ColorCombo27ColorCombo28ColorCombo29ColorCombo30ColorCombo31ColorCombo32ColorCombo33ColorCombo34ColorCombo35ColorCombo36ColorCombo37ColorCombo38ColorCombo39ColorCombo40ColorCombo41ColorCombo42ColorCombo43ColorCombo44ColorCombo45ColorCombo46ColorCombo47ColorCombo48ColorCombo49ColorCombo50ColorCombo51ColorCombo52ColorCombo53ColorCombo54ColorCombo55ColorCombo56ColorCombo57ColorCombo58ColorCombo59ColorCombo60ColorCombo61ColorCombo62ColorCombo63ColorCombo64ColorCombo65ColorCombo66ColorCombo67ColorCombo68ColorCombo69ColorCombo70ColorCombo71ColorCombo72ColorCombo73ColorCombo74ColorCombo75ColorCombo76ColorCombo77ColorCombo78ColorCombo79ColorCombo80ColorCombo81ColorCombo82ColorCombo8 3ColorCombo84ColorCombo85ColorCombo86ColorCombo87ColorCombo88ColorCombo89ColorCombo90ColorCombo91ColorCombo92ColorCombo93ColorCombo94ColorCombo95ColorCombo96ColorCombo97ColorCombo98ColorCombo99ColorCombo100ColorCombo101ColorCombo102ColorCombo103ColorCombo104ColorCombo105ColorCombo106ColorCombo107ColorCombo108ColorCombo109ColorCombo110ColorCombo111ColorCombo112ColorCombo113ColorCombo114ColorCombo115ColorCombo116ColorCombo117ColorCombo118ColorCombo119ColorCombo120ColorCombo121ColorCombo122ColorCombo123ColorCombo124ColorCombo125ColorCombo126ColorCombo127ColorCombo128ColorCombo129ColorCombo130ColorCombo131ColorCombo132ColorCombo133ColorCombo134ColorCombo135ColorCombo136ColorCombo137ColorCombo138ColorCombo139ColorCombo140ColorCombo141ColorCombo142ColorCombo143ColorCombo144ColorCombo145ColorCombo146ColorCombo147ColorCombo148ColorCombo149ColorCombo150ColorCombo151ColorCombo152ColorCombo153ColorCombo154ColorCombo155ColorCombo156ColorCombo157ColorCombo158ColorCombo159ColorCombo160ColorCombo161C olorCombo162ColorCombo163ColorCombo164ColorCombo165ColorCombo166ColorCombo167ColorCombo168ColorCombo169ColorCombo170ColorCombo171ColorCombo172ColorCombo173ColorCombo174ColorCombo175ColorCombo176ColorCombo177ColorCombo178ColorCombo179ColorCombo180ColorCombo181ColorCombo182ColorCombo183ColorCombo184ColorCombo185ColorCombo186ColorCombo187ColorCombo188ColorCombo189ColorCombo190ColorCombo191ColorCombo192ColorCombo193ColorCombo194ColorCombo195ColorCombo196ColorCombo197ColorCombo198ColorCombo199ColorCombo200ColorCombo201ColorCombo202ColorCombo203ColorCombo204ColorCombo205ColorCombo206ColorCombo207ColorCombo208ColorCombo209ColorCombo210ColorCombo211ColorCombo212ColorCombo213ColorCombo214ColorCombo215ColorCombo216ColorCombo217ColorCombo218ColorCombo219ColorCombo220ColorCombo221ColorCombo222ColorCombo223ColorCombo224ColorCombo225ColorCombo226ColorCombo227ColorCombo228ColorCombo229ColorCombo230ColorCombo231ColorCombo232ColorCombo233ColorCombo234ColorCombo235ColorCombo236ColorCombo237ColorCombo238 ColorCombo239ColorCombo240ColorCombo241ColorCombo242ColorCombo243ColorCombo244ColorCombo245ColorCombo246ColorCombo247ColorCombo248ColorCombo249ColorCombo250ColorCombo251ColorCombo252ColorCombo253ColorCombo254ColorCombo255ColorCombo256ColorCombo257ColorCombo258ColorCombo259ColorCombo260ColorCombo261ColorCombo262ColorCombo263ColorCombo264ColorCombo265ColorCombo266ColorCombo267ColorCombo268ColorCombo269ColorCombo270ColorCombo271ColorCombo272ColorCombo273ColorCombo274ColorCombo275ColorCombo276ColorCombo277ColorCombo278ColorCombo279ColorCombo280ColorCombo281ColorCombo282ColorCombo283ColorCombo284ColorCombo285ColorCombo286ColorCombo287ColorCombo288ColorCombo289ColorCombo290ColorCombo291ColorCombo292ColorCombo293ColorCombo294ColorCombo295ColorCombo296ColorCombo297ColorCombo298ColorCombo299ColorCombo300ColorCombo301ColorCombo302ColorCombo303ColorCombo304ColorCombo305ColorCombo306ColorCombo307ColorCombo308ColorCombo309ColorCombo310ColorCombo311ColorCombo312ColorCombo313ColorCombo314ColorCombo31 5ColorCombo316ColorCombo317ColorCombo318ColorCombo319ColorCombo320ColorCombo321ColorCombo322ColorCombo323ColorCombo324ColorCombo325ColorCombo326ColorCombo327ColorCombo328ColorCombo329ColorCombo330ColorCombo331ColorCombo332ColorCombo333ColorCombo334ColorCombo335ColorCombo336ColorCombo337ColorCombo338ColorCombo339ColorCombo340ColorCombo341ColorCombo342ColorCombo343ColorCombo344ColorCombo345ColorCombo346ColorCombo347ColorCombo348ColorCombo349ColorCombo350ColorCombo351ColorCombo352ColorCombo353ColorCombo354ColorCombo355ColorCombo356ColorCombo357ColorCombo358ColorCombo359ColorCombo360ColorCombo361ColorCombo362ColorCombo363ColorCombo364ColorCombo365ColorCombo366ColorCombo367ColorCombo368ColorCombo369ColorCombo370ColorCombo371ColorCombo372ColorCombo373ColorCombo374ColorCombo375ColorCombo376ColorCombo377ColorCombo378ColorCombo379ColorCombo380ColorCombo381ColorCombo382ColorCombo383ColorCombo384ColorCombo385ColorCombo386ColorCombo387ColorCombo388ColorCombo389ColorCombo390ColorCombo391ColorCombo3 92ColorCombo393ColorCombo394ColorCombo395ColorCombo396

Другие варианты Получить дополнения Получить ссылку Показать текст Очистить все Получить цвета сайта

,

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

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