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

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

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

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

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

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

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

FFFFCC		FFFF99FFFF66FFFF33FFFF00CCCC00
      
 
FFCC66FFCC00FFCC33CC9900CC9933996600
      
 
FF9900FF9933CC9966CC6600996633663300
 
 		    
 
FFCC99FF9966FF6600CC6633993300660000
      
 
FF6633CC3300FF3300FF0000CC0000990000
    
 		 
 
FFCCCCFF9999FF6666FF3333FF0033CC0033
      
 
CC9999CC6666CC3333993333990033330000
      
 
FF6699
FF3366		FF0066CC3366996666663333
      
 
FF99CCFF3399FF0099CC0066993366660033
      
 
FF66CCFF00CCFF33CCCC6699CC0099990066
 		     
 
FFCCFFFF99FFFF66FFFF33FFFF00FFCC3399
      
 
CC99CCCC66CCCC00CCCC33CC990099993399
      
 
CC66FFCC33FFCC00FF9900CC996699660066
      
 
CC99FF9933CC9933FF9900FF660099663366
      
 
9966CC9966FF6600CC6633CC663399330033
      
 
CCCCFF9999FF6633FF6600FF330099330066
      
 
9999CC6666FF6666CC666699333399333366
  
 		   
 
3333FF3300FF3300CC3333CC000099000066
      
 
6699FF3366FF0000FF0000CC0033CC000033
     
 
 
0066FF0066CC3366CC0033FF003399003366
      
 
99CCFF3399FF0099FF6699CC336699006699
      
 
66CCFF33CCFF00CCFF3399CC0099CC003333
      
 
99CCCC66CCCC339999669999006666336666
      
 
CCFFFF99FFFF66FFFF33FFFF00FFFF00CCCC
      
 
99FFCC66FFCC33FFCC00FFCC33CCCC009999
      
 
66CC9933CC9900CC99339966009966006633
      
 
66FF9933FF9900FF9933CC6600CC66009933
      
 
99FF9966FF6633FF6600FF66339933006600
      
 
CCFFCC99CC9966CC66669966336633003300
 		     
 
33FF3300FF3300FF0000CC0033CC3300CC33
      
 
66FF0066FF3333FF0033CC00339900009900
      
 
CCFF9999FF6666CC0066CC33669933336600
      
 
99FF0099FF3399CC6699CC0099CC33669900
      
 
CCFF66CCFF00CCFF33CCCC99666633333300
      
 
CCCC66CCCC33999966999933999900666600
      
 
FFFFFFCCCCCC999999666666333333000000
      

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


htmlweb.ru

Палитра web-цветов для сайта

Палитра web-цветов

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

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

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

Над каждым цветом указано его значение в RGB (для создания цвета в графическом редакторе).

Если вы хотите «поиграть с цветами», попробовать различные сочетания, подобрать оттенки — рекомендуем вам зайти на сайт http://colorschemedesigner.com.

 

Написание Цвет R G B Код для HTML
Snow Snow 255 250 250 #FFFAFA
GhostWhite GhostWhite 248 248 255 #F8F8FF
WhiteSmoke WhiteSmoke 245 245 245 #F5F5F5
Gainsboro Gainsboro 220 220 220 #DCDCDC
FloralWhite FloralWhite 255 250 240 #FFFAF0
OldLace OldLace 253 245 230 #FDF5E6
Linen Linen 250 240 230 #FAF0E6
AntiqueWhite AntiqueWhite 250 235 215 #FAEBD7
PapayaWhip PapayaWhip 255 239 213 #FFEFD5
BlanchedAlmond BlanchedAlmond 255 235 205 #FFEBCD
Bisque Bisque 255 228 196 #FFE4C4
PeachPuff PeachPuff 255 218 185 #FFDAB9
NavajoWhite NavajoWhite 255 222 173 #FFDEAD
Moccasin Moccasin 255 228 181 #FFE4B5
Cornsilk Cornsilk 255 248 220 #FFF8DC
Ivory Ivory 255 255 240 #FFFFF0
LemonChiffon LemonChiffon 255 250 205 #FFFACD
Seashell Seashell 255 245 238 #FFF5EE
Honeydew Honeydew 240 255 240 #F0FFF0
MintCream MintCream 245 255 250 #F5FFFA
Azure Azure 240 255 255 #F0FFFF
AliceBlue AliceBlue 240 248 255 #F0F8FF
lavender lavender 230 230 250 #E6E6FA
LavenderBlush LavenderBlush 255 240 245 #FFF0F5
MistyRose MistyRose 255 228 225 #FFE4E1
White White 255 255 255 #FFFFFF
Black Black 0 0 0 #000000
DarkSlateGray DarkSlateGray 47 79 79 #2F4F4F
DimGrey DimGrey 105 105 105 #696969
SlateGrey SlateGrey 112 128 144 #708090
LightSlateGray LightSlateGray 119 136 153 #778899
Grey Grey 190 190 190 #BEBEBE
LightGray LightGray 211 211 211 #D3D3D3
MidnightBlue MidnightBlue 25 25 112 #191970
NavyBlue NavyBlue 0 0 128 #000080
CornflowerBlue CornflowerBlue 100 149 237 #6495ED
DarkSlateBlue DarkSlateBlue 72 61 139 #483D8B
SlateBlue SlateBlue 106 90 205 #6A5ACD
MediumSlateBlue MediumSlateBlue 123 104 238 #7B68EE
LightSlateBlue LightSlateBlue 132 112 255 #8470FF
MediumBlue MediumBlue 0 0 205 #0000CD
RoyalBlue RoyalBlue 65 105 225 #4169E1
Blue Blue 0 0 255 #0000FF
DodgerBlue DodgerBlue 30 144 255 #1E90FF
DeepSkyBlue DeepSkyBlue 0 191 255 #00BFFF
SkyBlue SkyBlue 135 206 235 #87CEEB
LightSkyBlue LightSkyBlue 135 206 250 #87CEFA
SteelBlue SteelBlue 70 130 180 #4682B4
LightSteelBlue LightSteelBlue 176 196 222 #B0C4DE
LightBlue LightBlue 173 216 230 #ADD8E6
PowderBlue PowderBlue 176 224 230 #B0E0E6
PaleTurquoise PaleTurquoise 175 238 238 #AFEEEE
DarkTurquoise DarkTurquoise 0 206 209 #00CED1
MediumTurquoise MediumTurquoise 72 209 204 #48D1CC
Turquoise Turquoise 64 224 208 #40E0D0
Cyan Cyan 0 255 255 #00FFFF
LightCyan LightCyan 224 255 255 #E0FFFF
CadetBlue CadetBlue 95 158 160 #5F9EA0
MediumAquamarine MediumAquamarine 102 205 170 #66CDAA
Aquamarine Aquamarine 127 255 212 #7FFFD4
DarkGreen DarkGreen 0 100 0 #006400
DarkOliveGreen DarkOliveGreen 85 107 47 #556B2F
DarkSeaGreen DarkSeaGreen 143 188 143 #8FBC8F
SeaGreen SeaGreen 46 139 87 #2E8B57
MediumSeaGreen MediumSeaGreen 60 179 113 #3CB371
LightSeaGreen LightSeaGreen 32 178 170 #20B2AA
PaleGreen PaleGreen 152 251 152 #98FB98
SpringGreen SpringGreen 0 255 127 #00FF7F
LawnGreen LawnGreen 124 252 0 #7CFC00
Green Green 0 255 0 #00FF00
Chartreuse Chartreuse 127 255 0 #7FFF00
MedSpringGreen MedSpringGreen 0 250 154 #00FA9A
GreenYellow GreenYellow 173 255 47 #ADFF2F
LimeGreen LimeGreen 50 205 50 #32CD32
YellowGreen YellowGreen 154 205 50 #9ACD32
ForestGreen ForestGreen 34 139 34 #228B22
OliveDrab OliveDrab 107 142 35 #6B8E23
DarkKhaki DarkKhaki 189 183 107 #BDB76B
PaleGoldenrod PaleGoldenrod 238 232 170 #EEE8AA
LtGoldenrodYello LtGoldenrodYello 250 250 210 #FAFAD2
LightYellow LightYellow 255 255 224 #FFFFE0
Yellow Yellow

www.kasper.by

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

moonback.ru

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

Эти цвета будут корректно отображаться во всех браузерах.

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
#333333

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.51
#999966

153.153.102
#999933

153.153.0
#999900

102.102.0
#666600

255.255.255
#FFFFFF

204.204.204
#CCCCCC

www.ph4.ru

Таблица кодов безопасных цветов HTML и CSS

Таблица кодов безопасных цветов предназначена для перевода цвета, который вы подобрали, в RGB код (для создания цвета в графическом редакторе) и HEX код (для обозначения цвета в HTML). Цвета html представлены шестью символами, обозначающими доли красного, зеленого и синего цветов в конечном цвете. Известно, что изображение на мониторе компьютера формируется из огромного числа точек — пикселей. Каждый пиксель представляет источник света, состоящий из красного, зеленого и синего цветов. Чтобы получить необходимый цвет, следует увеличить либо уменьшить интенсивность свечения этих цветов. Палитра «безопасных» цветов обеспечивает правильную передачу цвета на разных типах мониторов, компьютеров и браузеров. Надеемся, это поможет вам при редактировании внешнего вида, генерации расцветок своего сайта.

Формат кодов HEX /HTML.
Цвет в формате HEX — это шестнадцатеричное представление RGB. Каждый код HTML представлен в виде 6 букв или цифр. Первые 2 символа в коде HTML означают насыщенность красного цвета; 3-й и 4-й символы — насыщенность зеленого, а 5-й и 6-й — насыщенность синего цвета. Все значения расположены между 00 и FF. Символы 00 означают наименее насыщенный цвет, FF — максимально насыщенный.

Цветовое пространство RGB состоит из множества всевозможных цветов, полученных путем комбинирования разных по насыщенности оттенков красного, зеленого и синего цветов.

255.255.204255.255.153255.255.102255.255.51255.255.0204.204.0
FFFFCCFFFF99FFFF66FFFF33FFFF00CCCC00
255.204.102255.204.0255.204.51204.153.0204.153.51153.102.0
FFCC66FFCC00FFCC33CC9900CC9933996600
255.153.0255.153.51204.153.102204.102.0153.102.51102.51.0
FF9900FF9933CC9966CC6600996633663300
255.204.153255.153.102255.102.0204.102.51153.51.0102.0.0
FFCC99FF9966FF6600CC6633993300660000
255.102.51204.51.0255.51.0255.0.0204.0.0153.0.0
FF6633CC3300FF3300FF0000CC0000990000
255.204.204255.153.153255.102.102255.51.51255.0.51204.0.51
FFCCCCFF9999FF6666FF3333FF0033CC0033
204.153.153204.102.102204.51.51153.51.51153.0.5151.0.0
CC9999CC6666CC3333993333990033330000
255.102.153255.51.102255.0.102204.51.102153.102.102102.51.51
FF6699FF3366FF0066CC3366996666663333
255.153.204255.51.153255.0.153204.0.102153.51.102102.0.51
FF99CCFF3399FF0099CC0066993366660033
255.102.204255.0.204255.51.204204.102.153204.0.153153.0.102
FF66CCFF00CCFF33CCCC6699CC0099990066
255.204.255255.153.255255.102.255255.51.255255.0.255204.51.153
FFCCFFFF99FFFF66FFFF33FFFF00FFCC3399
204.153.204204.102.204204.0.204204.51.204153.0.153153.51.153
CC99CCCC66CCCC00CCCC33CC990099993399
204.102.255204.51.255204.0.255153.0.204153.102.153102.0.102
CC66FFCC33FFCC00FF9900CC996699660066
204.153.255153.51.204153.51.255153.0.255102.0.153102.51.102
CC99FF9933CC9933FF9900FF660099663366
153.102.204153.102.255102.0.204102.51.204102.51.15351.0.51
9966CC9966FF6600CC6633CC663399330033
204.204.255153.153.255102.51.255102.0.25551.0.15351.0.102
CCCCFF9999FF6633FF6600FF330099330066
153.153.204102.102.255102.102.204102.102.15351.51.15351.51.102
9999CC6666FF6666CC666699333399333366
51.51.25551.0.25551.0.20451.51.2040.0.1530.0.102
3333FF3300FF3300CC3333CC000099000066
102.153.25551.102.2550.0.2550.0.2040.51.2040.0.51
6699FF3366FF0000FF0000CC0033CC000033
0.102.2550.102.20451.102.2040.51.2550.51.1530.51.102
0066FF0066CC3366CC0033FF003399003366
153.204.25551.153.2550.153.255102.153.20451.102.1530.102.153
99CCFF3399FF0099FF6699CC336699006699
102.204.25551.204.2550.204.25551.153.2040.153.2040.51.51
66CCFF33CCFF00CCFF3399CC0099CC003333
153.204.204102.204.20451.153.153102.153.1530.102.10251.102.102
99CCCC66CCCC339999669999006666336666
204.255.255153.255.255102.255.25551.255.2550.255.2550.204.204
CCFFFF99FFFF66FFFF33FFFF00FFFF00CCCC
153.255.204102.255.20451.255.2040.255.20451.204.2040.153.153
99FFCC66FFCC33FFCC00FFCC33CCCC009999
102.204.15351.204.1530.204.15351.153.1020.153.1020.102.51
66CC9933CC9900CC99339966009966006633
102.255.15351.255.1530.255.15351.204.1020.204.1020.153.51
66FF9933FF9900FF9933CC6600CC66009933
153.255.153102.255.10251.255.1020.255.10251.153.510.102.0
99FF9966FF6633FF6600FF66339933006600
204.255.204153.204.153102.204.102102.153.10251.102.510.51.0
CCFFCC99CC9966CC66669966336633003300
51.255.510.255.510.255.00.204.051.204.510.204.51
33FF3300FF3300FF0000CC0033CC3300CC33
102.255.0102.255.5151.255.051.204.051.153.00.153.0
66FF0066FF3333FF0033CC00339900009900
204.255.153153.255.102102.204.0102.204.51102.153.5151.102.0
CCFF9999FF6666CC0066CC33669933336600
153.255.0153.255.51153.204.102153.204.0153.204.51102.153.0
99FF0099FF3399CC6699CC0099CC33669900
204.255.102204.255.0204.255.51204.204.153102.102.5151.51.0
CCFF66CCFF00CCFF33CCCC99666633333300
204.204.102204.204.51153.153.102153.153.51153.153.0102.102.0
CCCC66CCCC33999966999933999900666600
255.255.255204.204.204153.153.153102.102.10251.51.510.0.0
FFFFFFCCCCCC999999666666333333000000

infofaq.ru

Как правильно выбрать цветовую схему для сайта?

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


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

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

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

Знание всего нескольких правил позволит сделать выбор цветовых решений не таким тяжелым.

Прочитав эту статью, вы узнаете, как:

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

Если я попрошу вас подумать о Кока-Коле, что первым придет вам на ум? Скорее всего, в вашем воображении всплывёт красный логотип Кока-Колы:


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

Красный в цветовой схеме несет в себе два важных послания:

  1. Ярко-красные этикетки сильно выделяются на фоне остальных на прилавках с газировкой.
  2. Каждый цвет вызывает определенные эмоции. Когда мы видим красный, у нас на подсознательном уровне возникает чувство возбуждения, любви и страсти. Именно эти чувства Кока-Кола хочет вызвать своими напитками:


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

85% покупателей признают, что основной причиной покупки товара явился его цвет.

Узнаваемость бренда увеличивается на 80% при использовании цвета.

При разработке дизайна сайта нужно:

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

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

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

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

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


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

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

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

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

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

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

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

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

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

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

Фиолетовый – символ величия, богатства, успеха и мудрости. Часто присутствует в косметике. Влияет на людей успокаивающе.

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

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

Чёрный – цвет влияния, роскоши, опытности и элегантности. Часто используется для продвижения товаров класса люкс и ассоциируется с профессионализмом, силой и аккуратностью.

Ваша целевая аудитория – молодые и энергичные покупатели? Или более опытные люди с солидным заработком? Ваш продукт (сервис) нацелен в большей степени на мужчин или на женщин? Подходит ли он только для определенной возрастной группы?

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

На кого преимущественно рассчитан ваш сайт, на мужчин или на женщин? А может и на тех, и на других?


Яркие и приглушенные цветовые схемы для сайта

Мужчины предпочитают яркие цвета, а женщины приглушенные.

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

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

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

Светлые и темные оттенки

Женщинам больше нравятся светлые оттенки. Причиной этого является их усиленное восприятие определённых цветов.

Женщины

Наиболее предпочтительные цвета: синий, фиолетовый, зеленый.

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

Мужчины

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

Наименее предпочтительные цвета: коричневый, оранжевый, фиолетовый.

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

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

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

Часто люди покупают определенные товары или услуги, чтобы произвести конкретное впечатление на других.

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


Так что если вы хотите, чтобы ваш продукт покупали люди, которые любят природу – используйте зеленый в цветовой схеме HTML. Хотите привлечь людей, чувствующих себя молодыми и уверенными в себе? Используйте желтый. Если вас интересуют люди, которым хочется выглядеть солидно и богато, используйте черный.

Теперь ясно?

Подумайте об идеальном представителе целевой аудитории. Каким он хочет казаться другим людям?

Да, это затрагивает психологию. Но вам необходимо в этом разбираться, чтобы создать успешный бренд.

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

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

Например, позвонить по телефонному номеру, заполнить форму, подписаться на обновления и т.п.

Преобладающий цвет должен бросаться в глаза, выделяя те детали, на которые вы хотите обратить внимание пользователей:


Где использовать преобладающий цвет на сайте?

  • Логотип;
  • Вкладки меню;
  • Кнопка «Позвонить»;
  • Важная информация;
  • Заголовки и названия;
  • Кнопки.

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

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

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

Как только вы определились с преобладающим цветом, нет ничего проще, чем подобрать акцентные цвета с помощью таких программ, как Adobe Color CC Tool:


Вот короткая инструкция, которая покажет вам, как создать цветовую схему одним из двух способов:

  1. На основе преобладающего цвета

Шаг 1. Для начала узнайте код вашего преобладающего цвета. Например, на сайте ColorPicker.com. Код цвета указан в прямоугольнике прямо над квадратом с цветовой палитрой.

Скопировав код с ColorPicker.com, вставьте его в поле «НЕХ» инструмента Adobe Color. Убедитесь, что вы вставили код в колонку посередине:


Вставьте код преобладающего цвета вашего сайта в прямоугольник ПОСЕРЕДИНЕ.

Как только вы зададите цвет, Adobe Color отобразит его на экране вместе с другими комплементарными цветами.

Шаг 2. В левой верхней стороне вы увидите прямоугольник со следующими цветовыми схемами:

  • Последовательная;
  • Монохромная;
  • Треугольная;
  • Комплементарная;
  • Составная;
  • Оттенки.


Выберите цветовую схему

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

Шаг 3. Сделайте цветовую схему еще продуманнее, перемещая один из указателей цвета.

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


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

CMS и конструкторы сайтов позволяют вставить цветовые коды (HEX) для выделения любой части вашего сайта:


Скопируйте цветовые коды (HEX) для вашей цветовой схемы для сайта.

  1. На основе понравившейся фотографии

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

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

Шаг 1. Загрузите фотографию:


Нажмите на значок камеры, чтобы загрузить изображение.

Шаг 2. Выберите одно из пяти цветовых настроений:

  • Красочное;
  • Яркое;
  • Приглушенное;
  • Насыщенное;
  • Темное.

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


Выберите цветовое настроение.

Шаг 3. Сделайте цветовую схему еще продуманнее, перемещая один из указателей цвета по изображению:


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

Шаг 4. Предложенная цветовая палитра расположена под изображением. Вот как можно подобрать цветовую схему для вашего веб-дизайна.

Чтобы увидеть коды (HEX) цветов, нажмите на цветное колесико, расположенное в правом верхнем углу:


Нажмите на цветное колесико, чтобы увидеть коды цветов:


Скопируйте цветовые коды (HEX) для вашей цветовой схемы.

Где размещать вспомогательные цвета

Детали сайта, выделенные вспомогательными цветами, не являются основными акцентами. Но они все равно выделяются. Например, вспомогательными цветами можно выделять подзаголовки, дополнительные кнопки, диалоговые окна, заливать фон и т.д.

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


Где использовать вспомогательные цвета на вашем сайте?

  • Активная кнопка меню;
  • Подзаголовки;
  • Выделение второстепенной информации.
  1. Выбор фонового цвета

Вам когда-нибудь приходилось красить стены в своем доме?


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

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

Выбор фонового цвета для вашего сайта не сильно отличается от выбора краски для вашей комнаты!

Как правильно выбрать цвет фона

Если бы вы выбирали краску для современного магазина одежды и для загородного дома, то выбрали бы один и тот же цвет?
Очевидно – нет. Эти два помещения служат для разных целей.

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

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

Фоновый цвет вашего сайта зависит от того, на что вы хотите обратить внимание пользователей.

Проще говоря, фоновый цвет напрямую зависит от цели, которую вы преследуете, создавая сайт.

Замечали ли вы, что информационные ресурсы и интернет-магазины часто используют белые или нейтральные цветовые схемы для сайта?


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

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

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

При создании корпоративного ресурса преследуется одна цель – продвижение товаров или услуг.

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

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

Все потому, что цвет напрямую влияет на узнаваемость бренда (помните пример про Кока-Колу?) Когда вы используете различные оттенки цвета своего бренда в качестве фона, вы усиливаете его и делаете более запоминающимся для клиентов.

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

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

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

Если вы собираетесь создать сайт, связанной с творчеством (мода, дизайн, ресторанный бизнес, красота и т.д.), для вас нет никаких ограничений.

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


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

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

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

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

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

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

  • Выбрать для сайта правильный преобладающий цвет;
  • Выбрать для преобладающего цвета правильные вспомогательные цвета;
  • Выбрать соответствующий фоновый цвет.

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

Данная публикация представляет собой перевод статьи «How to Choose a Good Color Scheme For Your Website» , подготовленной дружной командой проекта Интернет-технологии.ру

www.internet-technologies.ru

Выбор правильного сочетания для вашего сайта / Habr

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

При выборе цветовой гаммы для сайта, важно сделать это правильно, руководствуясь основными принципами теории цвета. В статье рассматриваются наиболее значимые аспекты при выборе, основные принципы сочетания, назначение цвета в 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

habr.com

No related posts.