Цвета RAL – Таблица RAL CLASSIC — Все каталоги цветов RAL по CMYK и RGB с примерами — ColorScheme.Ru

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

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

Цветовой стандарт RAL начинает свою историю с 1927 года, когда специалистами из «Управления по торговым стандартам» Германии была впервые разработана коллекция, состоящая на тот момент из 40 цветов. С тех пор палитра RAL постоянно расширяется. Компания выпускает каталоги цветов, веера, содержащие примеры красок по RAL, разрабатывает и добавляет новые образцы.

На нашем сайте имеются все три современные цветовые шкалы, таблицы RAL с раскладкой по CMYK и RGB.

Каталог RAL CLASSIC в настоящее время содержит 213 цветов, в том числе 15 перламутровых, 5 люминесцентных, и 2 железных.

Имя цвета в таблице RAL CLASSIC состоит из четырёхзначного числа в сочетании с префиксом «RAL» (например, RAL 1037). Первая цифра является кодом оттенка (1 – желтые, 2 – оранжевые, 3 – красные, 4 – фиолетовые, 5 – синие, 6 – зелёные, 7 – серые, 8 – коричневые, 9 – белые и чёрные). Остальные три цифры выбраны последовательно. Русскоязычное имя цвета (например, «солнечно-жёлтый» для RAL 1037) не является нормативным, для обозначения цвета достаточно запомнить лишь цифры.

Жёлтые тона	Цвет RAL	CMYK (C)	CMYK (U)	HTML	RGB
	RAL 1000 Зелёно-бежевый	10  10  50  10	0   3  40  10	#CCC58F	204 197 143
	RAL 1001 Бежевый	0  20  50  20	10  20  40   0	#D1BC8A	209 188 138
	RAL 1002 Песочно-жёлтый	0  20  60  10	3  23  60   7	#D2B773	210 183 115
	RAL 1003 Сигнальный жёлтый	5  20  90   0	0  20 100   0	#F7BA0B	247 186  11
	RAL 1004 Жёлто-золотой	5  30 100   0	0  20 100  10	#E2B007	226 176   7
	RAL 1005 Медово-жёлтый	10  30 100   0	10  20  90   0	#C89F04	200 159   4
	RAL 1006 Кукурузно-жёлтый	5  30  90   0	0  30 100   0	#E1A100	225 161   0
	RAL 1007 Нарциссово-жёлтый	0  40 100   0	0  30 100   0	#E79C00	231 156   0
	RAL 1011 Коричнево-бежевый	30  40  70   0	20  50 100  10	#AF8A54	175 138  84
	RAL 1012 Лимонно-жёлтый	10  10  90   0	10  10 100   0	#D9C022	217 192  34
	RAL 1013 Жемчужно-белый	0   5  20  10	10  10  20   0	#E9E5CE	233 229 206
	RAL 1014 Слоновая кость	0  10  40  10	10  10  30   0	#DED09F	222 208 159
	RAL 1015 Светлая слоновая кость	0   5  30  10	10  10  20   0	#EADEBD	234 222 189
	RAL 1016 Жёлтая сера	10   0  90   0	10   0  80   0	#EAF044	234 240  68
	RAL 1017 Шафраново-жёлтый	0  30  70   0	0  30  90   0	#F4B752	244 183  82
	RAL 1018 Цинково-жёлтый	0   0  80   0	0   0  90   0	#F3E03B	243 224  59
	RAL 1019 Серо-бежевый	5  20  40  40	10  20  30   0	#A4957D	164 149 125
	RAL 1020 Оливково-жёлтый	1   5  30  40	10  10  50  25	#9A9464	154 148 100
	RAL 1021 Рапсово-жёлтый	0  10 100   0	0   0 100   0	#EEC900	238 201   0
	RAL 1023 Транспортно-жёлтый	0  10  90   0	0  10 100   0	#F0CA00	240 202   0
	RAL 1024 Охра жёлтая	30  40  70  10	0  20 100  25	#B89C50	184 156  80
	RAL 1026 Флуоресцентный (Fluorescent) Люминесцентный жёлтый	0   0 100   0	0   0 100   0	#F5FF00	245 255   0
	RAL 1027 Карри жёлтый	10  20  90  40	30  30 100   0	#A38C15	163 140  21
	RAL 1028 Дынно-жёлтый	0  30 100   0	0  20 100   0	#FFAB00	255 171   0
	RAL 1032 Жёлтый ракитник	0  30  90  10	0  20 100  10	#DDB20F	221 178  15
	RAL 1033 Георгиново-жёлтый	0  30  90   0	0  30 100   0	#FAAB21	250 171  33
	RAL 1034 Пастельно-жёлтый	0  30  80   0	0  30  60   0	#EDAB56	237 171  86
	RAL 1035 Жемчужный Глянец (Pearl Gloss) Перламутрово-бежевый	16  19  33  26	20  20  33  12	#A29985	162 153 133
	RAL 1036 Жемчужный Глянец (Pearl Gloss) Перламутрово-золотой	33  46  80  18	9  36  97  28	#927549	146 117  73
	RAL 1037 Солнечно-жёлтый	0  40 100   0	0  35  90   0	#EEA205	238 162   5
Оранжевые тона	Цвет RAL	CMYK (C)	CMYK (U)	HTML	RGB
	RAL 2000 Жёлто-оранжевый	0  50 100   0	0  40 100   0	#DD7907	221 121   7
	RAL 2001 Красно-оранжевый	0  80 100  20	0  70 100   0	#BE4E24	190  78  36
	RAL 2002 Алый	0  90 100  10	0  80 100   0	#C63927	198  57  39
	RAL 2003 Пастельно-оранжевый	0  52 100   0	0  60 100   0	#FA842B	250 132  43
	RAL 2004 Оранжевый	0  70 100   0	0  70 100   0	#E75B12	231  91  18
	RAL 2005 Флуоресцентный (Fluorescent) Люминесцентный оранжевый	0  75  75   5	0  50 100   0	#FF2300	255  35   0
	RAL 2007 Флуоресцентный (Fluorescent) Люминесцентный ярко-оранжевый	0  50 100   0	0  20  90   0	#FFA421	255 164  33
	RAL 2008 Ярко-красно-оранжевый	0  60 100   0	0  50 100   0	#F3752C	243 117  44
	RAL 2009 Транспортный оранжевый	5  70 100  10	0  60 100   0	#E15501	225  85   1
	RAL 2010 Сигнальный оранжевый	0  70 100  10	0  60 100   0	#D4652F	212 101  47
	RAL 2011 Насыщенный оранжевый	0  55 100   0	0  40 100   0	#EC7C25	236 124  37
	RAL 2012 Лососёво-оранжевый	0  60  70   0	0  80  80   0	#DB6A50	219 106  80
	RAL 2013 Жемчужный Глянец (Pearl Gloss) Перламутрово-оранжевый	0  80 100  40	10  80 100  10	#954527	149  69  39
Красные тона	Цвет RAL	CMYK (C)	CMYK (U)	HTML	RGB
	RAL 3000 Огненно-красный	0 100 100  20	0 100  90   0	#AB2524	171  37  36
	RAL 3001 Сигнальный красный	20 100  90  10	0 100  90   0	#A02128	160  33  40
	RAL 3002 Карминно-красный	10 100  90  20	0 100  90   0	#A1232B	161  35  43
	RAL 3003 Рубиново-красный	0 100 100  40	0 100  90  15	#8D1D2C	141  29  44
	RAL 3004 Пурпурно-красный	20 100 100  60	0 100  90  30	#701F29	112  31  41
	RAL 3005 Винно-красный	20 100  80  40	0 100  90  50	#5E2028	94  32  40
	RAL 3007 Чёрно-красный	60 100  70  80	50 100  90  40	#402225	64  34  37
	RAL 3009 Оксид красный	5  90 100  80	20 100  90  30	#703731	112  55  49
	RAL 3011 Коричнево-красный	20 100 100  40	0 100  90  30	#7E292C	126  41  44
	RAL 3012 Бежево-красный	5  50  50  10	20  60  50   0	#CB8D73	203 141 115
	RAL 3013 Томатно-красный	20  90 100  20	0 100 100  15	#9C322E	156  50  46
	RAL 3014 Розовый антик	0  70  30  10	10  70  40   0	#D47479	212 116 121
	RAL 3015 Светло-розовый	0  50  20  10	10  40  10   0	#E1A6AD	225 166 173
	RAL 3016 Кораллово-красный	0  90  90  20	0  90  90  10	#AC4034	172  64  52
	RAL 3017 Розовый	0  80  50  10	0  80  40   0	#D3545F	211  84  95
	RAL 3018 Клубнично-красный	5  90  70   5	0  90 100   0	#D14152	209  65  82
	RAL 3020 Транспортный красный	0 100 100  10	0  90  90   0	#C1121C	193  18  28
	RAL 3022 Лососёво-красный	0  60  70   0	0  70  60   0	#D56D56	213 109  86
	RAL 3024 Флуоресцентный (Fluorescent) Люминесцентный красный	0  80  90   0	0  70 100   0	#F70000	247   0   0
	RAL 3026 Флуоресцентный (Fluorescent) Люминесцентный ярко-красный	0  80 100   0	0  70 100   0	#FF0000	255   0   0
	RAL 3027 Малиново-красный	0 100  70  20	0 100  60  15	#B42041	180  32  65
	RAL 3028 Красный	5 100 100   0	5 100 100   0	#CB3334	203  51  52
	RAL 3031 Ориент красный	20 100  90  20	0  90  60  15	#AC323B	172  50  59
	RAL 3032 Жемчужный Глянец (Pearl Gloss) Перламутрово-рубиновый	10 100  90  50	10 100 100  30	#711521	113  21  33
	RAL 3033 Жемчужный Глянец (Pearl Gloss) Перламутрово-розовый	8  84  72  13	0  93  93   7	#B24C43	178  76  67
Фиолетовые тона	Цвет RAL	CMYK (C)	CMYK (U)	HTML	RGB
	RAL 4001 Красно-сиреневый	60  70   5  10	50  97  20   0	#8A5A83	138  90 131
	RAL 4002 Красно-фиолетовый	40 100  90   5	0 100  40  30	#933D50	147  61  80
	RAL 4003 Вересково-фиолетовый	10  70  10   0	7  90   0   0	#D15B8F	209  91 143
	RAL 4004 Бордово-фиолетовый	60 100  50  20	10 100   0  50	#691639	105  22  57
	RAL 4005 Сине-сиреневый	60 100   5  10	50  60   0   0	#83639D	131  99 157
	RAL 4006 Транспортный пурпурный	50 100   0  10	30 100   0   0	#992572	153  37 114
	RAL 4007 Пурпурно-фиолетовый	70 100  20  60	90   0  10  25	#4A203B	74  32  59
	RAL 4008 Сигнальный фиолетовый	60  90   0  10	30 100   0   0	#904684	144  70 132
	RAL 4009 Пастельно-фиолетовый	40  40  30   0	17  40  10  15	#A38995	163 137 149
	RAL 4010 Телемагента	10  90  30   0	0 100   0   0	#C63678	198  54 120
	RAL 4011 Жемчужный Глянец (Pearl Gloss) Перламутрово-фиолетовый	47  57   3   7	47  64   0   0	#8773A1	135 115 161
	RAL 4012 Жемчужный Глянец (Pearl Gloss) Перламутрово-ежевичный	50  50  20  23	54  57   3  26	#6B6880	107 104 128
Синие тона	Цвет RAL	CMYK (C)	CMYK (U)	HTML	RGB
	RAL 5000 Фиолетово-синий	100  40   5  40	100  70  10  25	#384C70	56  76 112
	RAL 5001 Зелёно-синий	90  20   0  80	100  50  10  20	#1F4764	31  71 100
	RAL 5002 Ультрамариново-синий	100  70   0  40	100  90   0   0	#2B2C7C	43  44 124
	RAL 5003 Сапфирово-синий	100  50   0  80	90   0  10  25	#2A3756	42  55  86
	RAL 5004 Чёрно-синий	100 100  70  40	84  53  47  56	#1D1F2A	29  31  42
	RAL 5005 Сигнальный синий	100  40   0  40	90  60   0   0	#154889	21  72 137
	RAL 5007 Бриллиантово-синий	80  20   0  40	100  40   0  20	#41678D	65 103 141
	RAL 5008 Серо-синий	60   0   0  90	100  50  10  60	#313C48	49  60  72
	RAL 5009 Лазурно-синий	90  30  10  40	100  40  10  20	#2E5978	46  89 120
	RAL 5010 Горечавково-синий	100  40   5  40	100  70   0   0	#13447C	19  68 124
	RAL 5011 Стально-синий	100  60  10  80	96  46  10  40	#232C3F	35  44  63
	RAL 5012 Голубой	90  30  10  10	97  26   0   0	#3481B8	52 129 184
	RAL 5013 Кобальтово-синий	100  60   0  60	90   0  10  25	#232D53	35  45  83
	RAL 5014 Голубино-синий	50  20   0  40	64  41  11  12	#6C7C98	108 124 152
	RAL 5015 Небесно-синий	100  30   0  10	100  20   0   0	#2874B2	40 116 178
	RAL 5017 Транспортный синий	100  20   5  40	90  50   0   0	#0E518D	14  81 141
	RAL 5018 Бирюзово-синий	90  10  40  10	93   7  33   3	#21888F	33 136 143
	RAL 5019 Капри синий	100  50  20  10	100  30   0  20	#1A5784	26  87 132
	RAL 5020 Океанская синь	100   0  40  80	100  30  50  40	#0B4151	11  65  81
	RAL 5021 Водная синь	100  20  50  10	100   0  30  15	#07737A	7 115 122
	RAL 5022 Ночной синий	100 100  40  40	90   0  10  25	#2F2A5A	47  42  90
	RAL 5023 Отдалённо-синий	80  40  10  20	100  60  10   0	#4D668E	77 102 142
	RAL 5024 Пастельно-синий	70  20  10  20	63  17   7   8	#6A93B0	106 147 176
	RAL 5025 Жемчужный Глянец (Pearl Gloss) Перламутровый горечавково-синий	97  48  31  15	100  30  20  20	#296478	41 100 120
	RAL 5026 Жемчужный Глянец (Pearl Gloss) Перламутровый ночной синий	100  80   0  50	90   0  10  25	#102C54	16  44  84
Зелёные тона	Цвет RAL	CMYK (C)	CMYK (U)	HTML	RGB
	RAL 6000 Патиново-зелёный	80  20  60  20	98   8  68  17	#327662	50 118  98
	RAL 6001 Изумрудно-зелёный	90  30  90  10	100   0 100  15	#28713E	40 113  62
	RAL 6002 Лиственно-зелёный	90  40  90  10	90   0 100  25	#276235	39  98  53
	RAL 6003 Оливково-зелёный	80  50  80  20	50  40 100  40	#4B573E	75  87  62
	RAL 6004 Сине-зелёный	100  50  60  40	100  30  50  40	#0E4243	14  66  67
	RAL 6005 Зелёный мох	100  60  90  20	100  20  90  30	#0F4336	15  67  54
	RAL 6006 Серо-оливковый	90  80  90  20	80  70 100  60	#40433B	64  67  59
	RAL 6007 Бутылочно-зелёный	80  50  80  60	80  60 100  60	#283424	40  52  36
	RAL 6008 Коричнево-зелёный	70  50  70  80	100 100 100  75	#35382E	53  56  46
	RAL 6009 Пихтовый зелёный	90  50  90  60	100  60  80  60	#26392F	38  57  47
	RAL 6010 Травяной зелёный	70  10  80  40	70   0 100  25	#3E753B	62 117  59
	RAL 6011 Резедово-зелёный	70  30  70   5	50  13  70  20	#66825B	102 130  91
	RAL 6012 Чёрно-зелёный	100  80 100  20	100  50  80  60	#31403D	49  64  61
	RAL 6013 Тростниково-зелёный	40  20  60  40	40  40  70  10	#797C5A	121 124  90
	RAL 6014 Жёлто-оливковый	80  50  90  60	50  70 100  50	#444337	68  67  55
	RAL 6015 Чёрно-оливковый	80  60  70  40	100 100 100  75	#3D403A	61  64  58
	RAL 6016 Бирюзово-зелёный	100  30  80   0	100   0  70  15	#026A52	2 106  82
	RAL 6017 Майский зелёный	80  20 100  10	77   0  97   0	#468641	70 134  65
	RAL 6018 Желто-зелёный	70   0  90   0	60   0 100   0	#48A43F	72 164  63
	RAL 6019 Бело-зелёный	35   0  40   0	30   0  30   0	#B7D9B1	183 217 177
	RAL 6020 Хромовый зелёный	90  60  80  20	80  40 100  50	#354733	53  71  51
	RAL 6021 Бледно-зелёный	50  10  50  10	43  13  50   7	#86A47C	134 164 124
	RAL 6022 Коричнево-оливковый	90  80 100  20	70 100  90  75	#3E3C32	62  60  50
	RAL 6024 Транспортный зелёный	90  10  80  10	90 100  70   0	#008754	0 135  84
	RAL 6025 Папоротниково-зелёный	80  30  90  10	50  10 100  25	#53753C	83 117  60
	RAL 6026 Опаловый зелёный	100  30  70  40	100   0  70  15	#005D52	0  93  82
	RAL 6027 Светло-зелёный	60   0  30   0	50   0  20   0	#81C0BB	129 192 187
	RAL 6028 Сосновый зелёный	100  60 100   0	100  30 100  40	#2D5546	45  85  70
	RAL 6029 Мятно-зелёный	100  20 100   5	100   0 100   0	#007243	0 114  67
	RAL 6032 Сигнальный зелёный	90  10  80   0	90   0  70   0	#0F8558	15 133  88
	RAL 6033 Мятно-бирюзовый	80  20  50   0	90   0  40  17	#478A84	71 138 132
	RAL 6034 Пастельно-бирюзовый	60  10  40   0	50   0  20  10	#7FB0B2	127 176 178
	RAL 6035 Жемчужный Глянец (Pearl Gloss) Перламутрово-зелёный	90   0 100  75	90  10 100  30	#1B542C	27  84  44
	RAL 6036 Жемчужный Глянец (Pearl Gloss) Перламутровый опаловый зелёный	100  10  60  50	100  10  60  30	#005D4C	0  93  76
	RAL 6037 Зелёный	90   0 100   0	90   0 100   0	#008F39	0 143  57
	RAL 6038 Флуоресцентный (Fluorescent) Люминесцентный зелёный	100   0 100   0	100   0 100   0	#00BB2E	0 187  46
Серые тона	Цвет RAL	CMYK (C)	CMYK (U)	HTML	RGB
	RAL 7000 Серая белка	40  10  10  40	33   6   6  36	#7E8B92	126 139 146
	RAL 7001 Серебристо-серый	10   0   0  40	20   7   7  30	#8F999F	143 153 159
	RAL 7002 Оливково-серый	30  30  50  40	37  37  57  15	#817F68	129 127 104
	RAL 7003 Серый мох	30  20  40  40	27  20  40  40	#7A7B6D	122 123 109
	RAL 7004 Сигнальный серый	0   0   0  45	7   4   4  33	#9EA0A1	158 160 161
	RAL 7005 Мышино-серый	30  10  20  60	48  42  39  20	#6B716F	107 113 111
	RAL 7006 Бежево-серый	0  10  30  60	29  43  56  35	#756F61	117 111  97
	RAL 7008 Серое хаки	30  40  70  40	10  30  90  40	#746643	116 102  67
	RAL 7009 Зелёно-серый	20  50  40  80	60  50  70  32	#5B6259	91  98  89
	RAL 7010 Брезентово-серый	20   5  30  80	60  47  50  43	#575D57	87  93  87
	RAL 7011 Железно-серый	40  10  20  80	60  40  30  30	#555D61	85  93  97
	RAL 7012 Базальтово-серый	20   0  10  80	50  20  20  40	#596163	89  97  99
	RAL 7013 Коричнево-серый	10  10  40  80	50  60 100  50	#555548	85  85  72
	RAL 7015 Сланцево-серый	40  10  10  80	80  65  33  45	#51565C	81  86  92
	RAL 7016 Антрацитово-серый	60  30  30  80	100  50  30  60	#373F43	55  63  67
	RAL 7021 Чёрно-серый	50  10   5  95	100  90  70  50	#2E3234	46  50  52
	RAL 7022 Серая умбра	30  20  40  80	80  80 100  75	#4B4D46	75  77  70
	RAL 7023 Серый бетон	40  20  40  40	50  40  40   0	#818479	129 132 121
	RAL 7024 Графитовый серый	80  60  50  40	90  60  30  60	#474A50	71  74  80
	RAL 7026 Гранитовый серый	60  20  30  80	100  40  50  60	#374447	55  68  71
	RAL 7030 Каменно-серый	20  10  20  40	0   0  10  40	#939388	147 147 136
	RAL 7031 Сине-серый	60  30  30  40	68  52  41  18	#5D6970	93 105 112
	RAL 7032 Галечный серый	0   0  20  40	0   0  10  25	#B9B9A8	185 185 168
	RAL 7033 Цементно-серый	30  10  30  40	37  13  37  30	#818979	129 137 121
	RAL 7034 Жёлто-серый	5   5  40  40	0   0  30  40	#939176	147 145 118
	RAL 7035 Светло-серый	5   0   5  20	20  14  14   0	#CBD0CC	203 208 204
	RAL 7036 Платиново-серый	10  10  10  40	30  30  20  10	#9A9697	154 150 151
	RAL 7037 Пыльно-серый	30  20  20  40	11   8   8  46	#7C7F7E	124 127 126
	RAL 7038 Агатовый серый	30  10  20  20	30  22  22   0	#B4B8B0	180 184 176
	RAL 7039 Кварцевый серый	50  40  50  40	60  60  60   0	#6B695F	107 105  95
	RAL 7040 Серое окно	20   5  10  40	30  20  10  10	#9DA3A6	157 163 166
	RAL 7042 Транспортный серый A	30  10  20  40	17   9   9  33	#8F9695	143 150 149
	RAL 7043 Транспортный серый B	30  10  20  80	87  81  74  29	#4E5451	78  84  81
	RAL 7044 Серый шёлк	0   0  15  30	10  10  10  10	#BDBDB2	189 189 178
	RAL 7045 Телегрей 1	20  10  10  40	10   0   0  40	#91969A	145 150 154
	RAL 7046 Телегрей 2	30  10  10  40	31  18  14  25	#82898E	130 137 142
	RAL 7047 Телегрей 4	0   0   5  20	0   0   0  12	#CFD0CF	207 208 207
	RAL 7048 Жемчужный Глянец (Pearl Gloss) Перламутровый мышино-серый	32  32  39  27	18  18  31  34	#888175	136 129 117
Коричневые тона	Цвет RAL	CMYK (C)	CMYK (U)	HTML	RGB
	RAL 8000 Зелёно-коричневый	50  50  80  10	20  40  90  25	#887142	136 113  66
	RAL 8001 Охра коричневая	40  60  90  10	10  50 100  10	#9C6B30	156 107  48
	RAL 8002 Сигнальный коричневый	60  80  80  10	20  80 100  30	#7B5141	123  81  65
	RAL 8003 Глиняный коричневый	50  70  80  10	0  60 100  40	#80542F	128  84  47
	RAL 8004 Медно-коричневый	40  80  80  10	0  70 100  25	#8F4E35	143  78  53
	RAL 8007 Олень коричневый	60  70  80  20	0  70 100  40	#6F4A2F	111  74  47
	RAL 8008 Оливково-коричневый	50  60  70  20	30  60 100  10	#6F4F28	111  79  40
	RAL 8011 Орехово-коричневый	10  60 100  80	10  90 100  50	#5A3A29	90  58  41
	RAL 8012 Красно-коричневый	5 100 100  80	0 100 100  50	#673831	103  56  49
	RAL 8014 Сепия коричневый	30  60 100  80	40  70 100  50	#49392D	73  57  45
	RAL 8015 Каштаново-коричневый	0  90 100  80	10 100 100  50	#633A34	99  58  52
	RAL 8016 Махагон коричневый	40  80  80  80	30  90  90  50	#4C2F26	76  47  38
	RAL 8017 Шоколадно-коричневый	60  80  80  80	50 100  90  60	#44322D	68  50  45
	RAL 8019 Серо-коричневый	90  90  80  80	70 100  90  75	#3F3A3A	63  58  58
	RAL 8022 Чёрно-коричневый	100 100  80  95	70 100  90  75	#211F20	33  31  32
	RAL 8023 Оранжево-коричневый	20  70 100  20	0  70 100  10	#A65E2F	166  94  47
	RAL 8024 Бежево-коричневый	30  60  70  40	0  60 100  40	#79553C	121  85  60
	RAL 8025 Бледно-коричневый	40  50  60  40	7  60  93  43	#755C49	117  92  73
	RAL 8028 Терракотовый	20  50  70  80	40  80 100  50	#4E3B2B	78  59  43
	RAL 8029 Перламутровый медный	23  80  93  43	0  80 100  40	#773C27	119  60  39
Чёрные и белые тона	Цвет RAL	CMYK (C)	CMYK (U)	HTML	RGB
	RAL 9001 Кремово-белый	0   0  10   5	0   0  10   0	#EFEBDC	239 235 220
	RAL 9002 Светло-серый	5   0  10  10	3   3  10   7	#DDDED4	221 222 212
	RAL 9003 Сигнальный белый	0   0   0   0	0   0   0   0	#F4F8F4	244 248 244
	RAL 9004 Сигнальный чёрный	100  90 100  80	100 100 100  75	#2E3032	46  48  50
	RAL 9005 Чёрный янтарь	100 100 100  95	87  65  66  58	#0A0A0D	10  10  13
	RAL 9006 Железный блеск (Iron Glimmer) Бело-алюминиевый	0   0   0  40	0   0   0  20	#A5A8A6	165 168 166
	RAL 9007 Железный блеск (Iron Glimmer) Тёмно-алюминиевый	0   0   0  60	17  14  17  29	#8F8F8C	143 143 140
	RAL 9010 Белый	0   0   5   0	0   0   7   0	#F7F9EF	247 249 239
	RAL 9011 Графитно-чёрный	100 100 100  80	90 100  97  75	#292C2F	41  44  47
	RAL 9016 Транспортный белый	3   0   0   0	0   0   0   0	#F7FBF5	247 251 245
	RAL 9017 Транспортный чёрный	100  90 100  95	87  66  66  58	#2A2D2F	42  45  47
	RAL 9018 Папирусно-белый	10   0  10  20	7   4  10   6	#CFD3CD	207 211 205
	RAL 9022 Жемчужный Глянец (Pearl Gloss) Перламутровый светло-серый	21  14  14  31	10   7   7  28	#9C9C9C	156 156 156
	RAL 9023 Жемчужный Глянец (Pearl Gloss) Перламутровый тёмно-серый	8   6   6  57	20  10  10  40	#7E8182	126 129 130

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

Material Palett
Генератор и экспорт палитры цветов в стиле материального дизайна.
http://www.materialpalette.com/

New Flat UI Color Picker
Лучшие цвета для интерфейсов в стиле flat.
http://www.flatuicolorpicker.com/

Flat UI Colors
Красивые цвета в стиле flat.
http://flatuicolors.com/

Coolors: 
Супер быстрый генератор цветовых схем для крутых дизайнеров.
https://coolors.co/

Skala Color
Необычный подбор цветов.
https://bjango.com/mac/skalacolor/

Couleurs
Простое приложения для определения цветов, которые вы видите на экране.
http://couleursapp.com/

Material UI Colors
Палитра цветов для Android, веба и iOS в стиле материального дизайна
https://www.materialui.co/colors

Colorful Gradients
Автоматическое создание градиентов.

http://colorfulgradients.tumblr.com/

Adaptive Backgrounds
Выделение доминирующих цветов из изображения.
http://briangonzalez.github. io/jquery.adaptive-backgr..

Brand Colors
Цвета, используемые знаменитыми брендами.
http://brandcolors.net/

Paletton
Создание цветовой схемы.
http://paletton.com/#uid=1000u0kllllaFw0g0qFqFg0w0aF

0 to 255
Простой инструмент поиска оттенков цвета.
http://www.0to255.com/

Colour Lovers
Создавайте и делитесь цветами, палитрами и паттернами.
http://www.colourlovers.com/

ISITLab Graphic Design
Эксклюзивный и стильный креатив, отражающий сущность вашего бизнеса
https://isitlab.com/ru/graphic-design

Adobe Color CC
Цветовые комбинации от сообщества Kuler.
https://color.adobe.com/ru/create/color-wheel/

Bootflat
Идеальные цвета в стиле flat.
http://bootflat.github.io/color-picker.html

Hex Colorrrs
Конвертер из Hex в RGB.
http://hex.colorrrs.com/

Get UI Colors
Поиск подходящих цветов для интерфейсов.
http://getuicolors.com/

Coleure
Умный подбор цветов.
https://www.coleure.com/

Colllor
Генератор цветовой палитры.

http://colllor.com/

Palette for Chrome
Создание палитры цветов из любого изображения.
https://chrome.google.com/webstore/detail/palette-cre..

Подбор цвета кровли, фасада и забора по каталогу RAL ☛ СТэП

Интерактивный подбор цвета

Нажми на иконку цвета — изменится цвет материалов.

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

 

Типовые цветовые решения

Лучшие цвета для крыши. Металлочерепица RAL

Лучшие цвета для стены

Лучшие цвета для забора

Крыша и фасад

Самые популярные сочетания цветов

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

Какой цвет подойдет больше вашему дому?

Подбор цвета крыши — задача не из простых. Ведь очень хочется, что бы коттедж ежедневно радовал взгляд. Радовал своим внешним видом вас и ваших соседей, а также органично вписывался в общий дизайн близлежащих домов и построек. Как известно всем, крыша является пятым фасадом, и ее часто видно в общей композиции дома. Поэтому подбор цвета является важной задачей при строительстве или облицовке частного дома. Ведь необходимо сделать так, чтобы все цвета гармонировали друг с другом. Лучше всего на частном доме смотрится крыша темных тонов, стены светлых тонов, а забор — «под цвет крыши». Это является одним из самых гармоничных сочетаний. Светлый фасад привлекает свежестью и выглядит более престижно и богато. В интерактивном подборе цвета достаточно выбрать иконку с нужным вам цветом. Цвет стены или крыши поменяются и упростят вам задачу подбора цвета вашего дома. После подбора цвета забора, крыши или фасада вам достаточно сообщить менеджеру понравившийся вам цвет по каталогу Ral. Менеджер уже точно будет знать выбранный вами цвет, что исключит случайность подмены цвета. Пожалуйста, используйте интерактивный подбор цвета для вашего дома на нашем сайте.

25 лучших сервисов для работы с цветом

Выбор цветов для проекта будь-то сайт или логотип – задача не из простых. Необходимо много навыков и умений, однако различные онлайн-сервисы могут значительно облегчить деятельность. Мы собрали 25 лучших инструментов для работы с цветом, которые обязательно помогут сделать ваш проект ярким и запоминающимся!

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

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

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

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

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

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

Если вы нашли веб-сайт, цветовое оформление которого вам понравилось, при помощи онлайн-сервиса Web Colour Data можно составить цветовую палитру: достаточно просто ввести адрес. Узнать можно не только цветовое наполнение, но и процентное соотношение каждого из цветов. Для примера на главной странице представлены палитры известных сайтов (Google, Pinterest, WordPress и др.).

Интересный ресурс, который позволяет любую цветовую схему сделать гармоничнее. Для начала можно создать свою палитру либо выбрать случайную, взятую с сайта Colourlovers. Затем на нее накладывается один цвет и регулируется яркость – готово!

Большая галерея картинок с соответствующими им цветовыми палитрами. Доступен поиск по цветам, также есть возможность отсортировать фото по популярности.

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

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

Заняться самой настоящей охотой за цветом можно на сайте Color Hunter. Сервис достаточно простой: доступен поиск по тегам или HEX-коду, а также есть возможность загрузить изображение и “разложить” его на цвета.

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

Сервис не самый простой, но весьма полезный. На ColorHexa есть множество информации по любому цвету: палитры, оттенки, тона, альтернативные варианты и коды в различных цветовых моделях. Отыскать все это просто: достаточно всего лишь ввести в поисковой строке нужный HEX- или RGB-код, либо английское название цвета.

Этот ресурс во многом схож с предыдущим. На Color-Hex также можно найти множество данных о каждом из цветов, будь то возможные палитры и тона или коды. Правда, цветовых наборов здесь можно найти несколько меньше, чем на ColorHexa, зато для разработчкиов здесь можно найти больше информации.

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

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

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

Инструмент для выбора цвета в стиле Material Design. Возможность в один клик копировать HEX- или RGB-код можно назвать одним из преимуществ сервиса.

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

Коллекция градиентов, цветовых кругов и двухцветных палитр.

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

Приложение, которым пользуются даже в таких известных компаниях как Amazon, Twitter и Pinterest, наверняка станет неплохим подспорьем при создании палитры. Правда, некоторые барьеры есть: доступен данный инструмент только на Mac или iPhone.

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

Простая и удобная галерея палитр и цветов от датского дизайнера Тристана Уайта.

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

Читайте также

Подбор цветов для сайта онлайн

Приветствую вас, дорогие посетители!

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

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

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

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

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

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

1. 1.Перейти в одну из 4 категорий цветовых схем:
2. 2.Можно воспользоваться фильтром по цвету, который расположен в правой части шапки:

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

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

   Выберете нужные цвета и нажмите на кнопку «Начать подбор». Для вас будут подобраны цветовые схемы, содержащие заданные цвета или их оттенки:

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

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

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

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

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

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

До встречи в следующих статьях!

С уважением Юлия Гусарь

Подбор цвета html для сайта

Инструмент поможет подобрать код цвета html для Вашего сайта. Ниже показано, как влияют некоторые цвета на российских потребителей: Красный Волнение, сила, секс, страсть, скорость, опасность. Синий доверие, надежность, принадлежность, прохлада. Желтый Теплота, свет, приветствие, счастье Оранжевый Игривость, теплота Зеленый Природа, новый, крутой, рост, изобилие Фиолетовый Королевский, духовность, достоинство Розовый Мягкий, сладкий, питание, защита Белый Чистый, девственный, юный, умеренный. Черный Искушенность, изящность, соблазнительность, тайна Золото Престиж, дорогой Серебро Престиж, холод, научный Рыночные исследователи также решили, что цвет затрагивает и привычки людей. Например, покупатели импульса отвечают лучше всего на красно-оранжевый, черный и королевский синий. Покупатели, которые планируют и придерживаются бюджетов ответят лучше всего на розовый, зажигает их синий и морской. Традиционно потребители отвечают на пастельно — розовый, также повысился цвет — синее небо. Инструменты / Вебмастеру

Новости Объявления

Цветовой круг онлайн — Mecolor.ru

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

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

Данная диаграмма, показывающая цвета спектра, первоначально создана Исааком Ньютоном в 1666 году, созданный им цветовой круг сегодня служит для множества целей и задач. Художники используют его для определения смешиваемых цветов, а дизайнеры выбирают те цвета, которые имеют хорошее сочетание. Все цветовой круг строится на базовых трех цветах – красный, синий, зеленый (Red, Blue, Green или RGB), также в нем присутствуют такие дополнительные цвета, как оранжевый, зеленый и фиолетовый цвета.

Закажите накрутку подписчиков в Инстаграме по низким ценам.

Разработка цветовой схемы с помощью круга

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

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

• Дополнительные цветовые схемы используют два противоположных цвета на цветовом круге.
• Монохроматические цветовые схемы используют три разных значения одного цвета.
• Аналогичные цветовые схемы используют три смежных цвета на цветовом круге.
• Сплит-дополнения используют цвет и два смежных третичных цвета его дополнения.
• Триадные цветовые схемы используют три равномерно распределенных цвета на цветовом круге.
• В тетрадных цветовых схемах используются две взаимодополняющие пары.

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

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

цветов HTML

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

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

Палитра цветов Палитра цветов Google Палитра цветов HTML

---

#ffebee

# ffcdd2

# ef9a9a

# e57373

# ef5350

# f44336

# e53935

# d32f2f

# c62828

# b71c1c

# fce4ec

# f8bbd0

# f48fb1

# f06292

# ec407a

# e91e63

# d81b60

# c2185b

# ad1457

# 880e4f

# f3e5f5

# e1bee7

# ce93d8

# ba68c8

# ab47bc

# 9c27b0

# 8e24aa

# 7b1fa2

# 6a1b9a

# 4a148c

# ede7f6

# d1c4e9

# b39ddb

# 9575cd

# 7e57c2

# 673ab7

# 5e35b1

# 512da8

# 4527a0

# 311b92

# e8eaf6

# c5cae9

# 9fa8da

# 7986cb

# 5c6bc0

# 3f51b5

# 3949ab

# 303f9f

# 283593

# 1a237e

# e3f2fd

#bbdefb

# 90caf9

# 64b5f6

# 42a5f5

# 2196f3

# 1e88e5

# 1976d2

# 1565c0

# 0d47a1

# e1f5fe

# b3e5fc

# 81d4fa

# 4fc3f7

# 29b6f6

# 03a9f4

# 039be5

# 0288d1

# 0277bd

# 01579b

# e0f7fa

# b2ebf2

# 80deea

# 4dd0e1

# 26c6da

# 00bcd4

# 00acc1

# 0097a7

# 00838f

# 006064

# e0f2f1

# b2dfdb

# 80cbc4

# 4db6ac

# 26a69a

# 009688

# 00897b

# 00796b

# 00695c

# 004d40

# e8f5e9

# c8e6c9

# a5d6a7

# 81c784

# 66bb6a

# 4caf50

# 43a047

# 388e3c

# 2e7d32

# 1b5e20

# f1f8e9

# dcedc8

# c5e1a5

# aed581

# 9ccc65

# 8bc34a

# 7cb342

# 689f38

# 558b2f

# 33691e

# f9fbe7

# f0f4c3

# e6ee9c

# dce775

# d4e157

# cddc39

# c0ca33

# afb42b

# 9e9d24

# 827717

# fffde7

# fff9c4

# fff59d

# fff176

# ffee58

# ffeb3b

# fdd835

# fbc02d

# f9a825

# f57f17

# fff8e1

# ffecb3

# ffe082

# ffd54f

# ffca28

# ffc107

# ffb300

# ffa000

# ff8f00

# ff6f00

# fff3e0

# ffe0b2

# ffcc80

# ffb74d

# ffa726

# ff9800

# fb8c00

# f57c00

# ef6c00

# e65100

# fbe9e7

#ffccbc

# ffab91

# ff8a65

# ff7043

# ff5722

# f4511e

# e64a19

# d84315

# bf360c

# efebe9

# d7ccc8

# bcaaa4

# a1887f

# 8d6e63

# 795548

# 6d4c41

# 5d4037

# 4e342e

# 3e2723

# f5f5f5

# e0e0e0

#bdbdbd

# 9e9e9e

# eceff1

# cfd8dc

# b0bec5

# 90a4ae

# 78909c

# 607d8b

ШЕСТИГР.

{{шестнадцатеричный}}

RGB

{{rgbval}}

HSL

{{hsl}}

Таблица цветов

У нас есть сотни цветовых сочетаний! Загляните на нашу страницу с таблицей цветов, чтобы вдохновиться.Изучите цвета плоского дизайна, дизайн Google Material, плавные цвета, схему дизайна метро — все с цветовыми кодами HEX и RGB.

Таблица цветов Плоские цвета Цвета Материального Дизайна

---

Рекомендуемые цвета

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

Генератор цвета Случайный цвет

---

Названия Цвета

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

Раздел названий цветов

---

Красивые градиенты каждый день

Gradient Hunt — это бесплатная и открытая коллекция модных градиентов ручной работы

Градиенты

Красивые цветовые палитры

Color Palettes — это тщательно отобранная коллекция красивых цветовых палитр, обновляемая ежедневно

Цветовые палитры Учебники по цвету HTML и CSS

Не знаете или что-то не помните о кодировании цветов? Что ж, мы предлагаем вам лучшие уроки HTML и CSS Color Tutorials причем большинство задают вопросы самым странным.Время учиться!

Научитесь кодировать

---

Цветовые палитры

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

цветовых палитр Создать палитры

---

Сделай свой градиент

Не знаете, как создавать градиенты? Нет проблем, с нашим градиентом и генератором градиентов вы понял бы, как легко и красиво создавать градиенты.Взглянем!

Градиенты Создать градиенты

---

Каковы 8 значений цвета HTML?

Теперь мы говорим о 8 цветовых значениях HTML (HEX, RGB, RGBA, HSL, HSLA, HSV, HWB, CMYK).

Значение цвета HEX представлено в шестнадцатеричном формате, поэтому для каждого из них диапазон изменяется от 00 до FF. Код выражается следующим образом: #RRGGBB, каждое из двухзначных значений представляет собой диапазон каждого из 3 цветов, с помощью которого мы выбираем окончательное значение, представляющее каждый цвет.

Значение цвета RGB, красный — зеленый — синий, основано на смешивании этих трех цветов для получения полного диапазона. Каждый из цветов принимает значение от 0 до 255, всего 256, при этом получается всего 256 x 256 x 256 = 16 777 216 различных цветов. Смешивание этих трех цветов даст вам цветовой код rgb, представленный как этот RGB (23,34,255).

Значение цвета RGBA, красный — зеленый — синий — альфа, которое добавляет новый коэффициент, альфа-канал, то есть непрозрачность или прозрачность, которая следует той же процентной схеме: 0% представляет абсолютную прозрачность, а 100% представляет абсолютную непрозрачность, которая это то, как мы традиционно видим цвета.

Значение цвета HSL. Эта модель включает два дополнительных параметра к оттенку или цветности для получения цвета: насыщенность, яркость или тон. Отсюда его аббревиатура: HSL (H — оттенок или оттенок, S — насыщенность или насыщенность, L — яркость или яркость / тон).

Значение цвета HSLA (H — оттенок или оттенок, S — насыщенность или насыщенность, L — яркость или яркость / тон — A — ALPHA) — это система, которая не является системой, которая обычно используется в веб-дизайне, но он используется в других областях, таких как редактирование фотографий или дизайн (в целом).

Значение цвета HSV включает два дополнительных параметра к оттенку или цветности для получения цвета: насыщенность и значение. Отсюда его аббревиатура: HSV (H — оттенок или оттенок, S — насыщенность или насыщенность, V — значение или значение).

Значение цвета HWB (оттенок-белизна-черная) очень похоже на HSV (оттенок, насыщенность, значение) и HSL (оттенок, насыщенность, яркость), за исключением того, что ни HSV, ни HSL не обеспечивают насыщенности для белизны.

CMYK Color Value является субтрактивной моделью и используется при печати пигментами трех основных цветов: C — голубой, M — пурпурный и Y — желтый.K происходит от черного, так как комбинация трех предыдущих дает немного чистого черного.

ДЛЯ ДОПОЛНИТЕЛЬНОЙ ИНФОРМАЦИИ ПОСЕТИТЕ ССЫЛКИ В ТЕКСТЕ ИЛИ ПОСЕТИТЕ НАШУ ТЕОРИЮ ЦВЕТА.

Теория цвета

---

Общие цвета

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

Общие цвета

ПОДЕЛИТЬСЯ С ДРУЗЬЯМИ!

Лучшие инструменты для работы с цветом для веб-дизайнеров в 2021 году

Инструменты

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

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

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

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

01. HueSnap

Создавайте вдохновение на ходу и превращайте его в цветовые палитры

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

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

02.Khroma

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

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

03. Coolors.co

Раздел «Обзор» включает сотни, если не тысячи, вариантов палитры.

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

Coolors доступен на настольных компьютерах. Более того, в нем также есть приложение для iOS, надстройка Adobe (PhotoShop, Illustrator, InDesign) и даже расширение Google Chrome для легкого доступа.

04. Adobe Color CC

Это было давно, но все еще невероятно полезно

Бесплатный инструмент Adobe Color CC существует уже некоторое время, и это один из лучших цветовых инструментов для выбора цветовой палитры . Вы можете не только создавать свои собственные цветовые схемы, но и исследовать то, что создали другие. Выберите цвет на колесе (или на изображении) и примените правила цвета, такие как использование только дополнительных цветов, монохроматических цветов или оттенков выбранного вами цвета, для создания цветовой палитры.(Или щелкните каждый цвет и исследуйте цветовое колесо, чтобы настроить выбор.)

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

05. Colordot

Используйте простые жесты мыши для создания цветовой палитры

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

06. Eggradients

Градиентное вдохновение и заставляющие задуматься имена

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

07. 147 цветов

Этот бесплатный инструмент включает стандартные цвета CSS.

Когда вы отвечаете за создание легко читаемых CSS, иногда лучше использовать стандартные цвета и названия цветов. Благодаря «147 цветов» от Брайана Майера-младшего вы сможете увидеть их все и выбрать те, которые вам подходят.Он содержит 17 стандартных цветов плюс 130 других названий цветов CSS. Отфильтруйте результаты по оттенкам синего, зеленого и т. Д. Или выберите из полной радуги.

08. Генератор цветовой палитры Canva

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

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

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

09. Палитра дизайна материалов

Создайте палитру на основе принципов дизайна материалов Google.

С помощью палитры дизайна материалов вы можете выбрать два цвета, которые затем преобразуются в полную цветовую палитру для загрузки вместе с предварительным просмотром.Компания также предлагает Material Design Colors, которые позволяют дизайнерам видеть различные оттенки цвета вместе с соответствующими им значениями HEX.

10. ColourCode

Сохранение и экспорт цветовых палитр в виде файлов SCSS, LESS или PNG

ColourCode Тамино Мартиниус и Андреас Сторм похож на Colordot, но предлагает немного больше рекомендаций. Этот бесплатный инструмент ударит вас прямо в лицо, демонстрируя фон, меняющий цвет при движении курсора. Кроме того, этот инструмент предлагает различные категории для палитры (аналоговая, триада, четырехугольник, монохромный, монохромный свет и т. Д.).

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

11. Калькулятор цвета

Выберите цвет и цветовую гармонию, и этот инструмент сгенерирует цветовую палитру.

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

12. Цветовой код HTML

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

Цветовые коды HTML — это расширяющийся бесплатный набор инструментов от Dixon. & Moe, который включает в себя подробный палитру цветов с множеством объяснений цветовых правил; серия цветовых диаграмм с плоскими цветами дизайна, схемой дизайна материалов Google и классической палитрой безопасных для Интернета цветов; и список стандартных названий цветов и кодов HTML.

Этот сайт также предлагает учебные пособия и другие ресурсы для веб-дизайнеров, а также варианты экспорта результатов из его инструментов в виде HEX-кодов, стилей HTML, CSS и SCSS.

13. W3Schools: Учебник по цветам

Это бесплатное руководство содержит ссылки на ряд удобных инструментов для работы с цветом.

Если вы ищете комплексное решение, включающее руководство по цветам, а также ряд различных инструментов, то Учебник по цветам на W3Schools — идеальный выбор. Вы можете не только узнать о теории цвета, цветовых кругах и цветовых оттенках, но также сможете использовать другие инструменты, которые у него есть, например, Color Converter.С помощью этого инструмента вы можете преобразовывать любые цвета в имена и обратно, HEX-коды, значения RGB, HSL, HWB и CMYK.

14. Цифровой измеритель цвета (Mac)

Встроенный инструмент Mac позволяет получать цвета с экрана

Хорошо, пользователи Mac, это для вас. С помощью встроенного в ваш аппарат цифрового измерителя цвета вы можете «взять» цвет из любого места на экране, а затем получить значения этого цвета в десятичном, шестнадцатеричном или процентном виде. Кроме того, вы даже можете «скопировать» выбранный цвет как текст или изображение.

Подробнее:

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

из изображения — ImageLR

Палитра цветов из часто задаваемых вопросов по изображениям

Разница между кодом HEX и кодом RGB?

Хотя коды HEX и RGB отображают одни и те же цвета, оба цветовых кода выглядят по-разному, поскольку код HEX в шестнадцатеричном формате из 6 цифр, с другой стороны, код RGB отображается в виде наборов из 3 чисел в диапазоне от 0 до 255.

Можно ли узнать цветовой код веб-сайта?

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

Как узнать, какие цвета на картинке?

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

Какие платформы поддерживает ImageLR?

Поскольку ImageLR является онлайн-инструментом, его можно использовать на нескольких платформах, таких как Windows, Mac, смартфоны и планшеты, при условии, что он подключен к Интернету.

Как преобразовать код RGB в HEX-код вручную?

Чтобы преобразовать значения RGB в HEX-код, вам необходимо преобразовать каждый набор чисел один за другим. Например, мы берем RGB-код коричневого цвета и пытаемся преобразовать его в HEX-код. Таким образом, значение RGB коричневого цвета составляет (165,42,42).

Чтобы преобразовать коды RGB в HEX-коды, вам понадобится помощь этой десятичной в шестнадцатеричной диаграмме. Потому что в шестнадцатеричном формате мы не можем записать 10 как 10, и мы должны записать его как A, а 11 как B и так далее.

Первый номер

Первое значение — 165, поэтому мы разделим 165 на 16, потому что есть 16 чисел (0-15) в шестнадцатеричной системе счисления. Итак, когда мы делим 165/16 = 10,32, первое число шестнадцатеричных кодов равно 10 или A.

Теперь мы берем напоминание и умножаем его на 16, поэтому получаем (0,32) x 16 = 5. Итак, теперь у нас есть первые две цифры шестнадцатеричного кода, которые равны # A5.

Второй номер

Второе число значения RGB — 42.Итак, мы проделываем тот же процесс снова, чтобы определить третье и четвертое число шестнадцатеричного кода. Теперь 42/16 = 2,63. Итак, третье число шестнадцатеричного кода — 2.

Теперь возьмите остаток и умножьте его на 16, чтобы получить (0,63) x 16 = 10 или A. Итак, третье и четвертое число шестнадцатеричного кода — 2A, и если мы сложим с ним первые два числа, то до сих пор мы имеем шестнадцатеричный код # A52A

Третий номер

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

Итак, наконец, шестнадцатеричное значение # A52A2A, которое является шестнадцатеричным значением коричневого цвета. Вот как вы вручную конвертируете значения RGB в HEX-коды.

Лучшие цветовые палитры для повышения вовлеченности веб-сайтов (2020)

Вызывает ли ваша цветовая схема желаемый отклик?

Вы ошеломлены количеством возможных цветовых палитр веб-сайта?

У всех есть любимые цвета, к которым они стремятся, когда дело касается работы или чего-то еще.

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

Цвета на самом деле вызывают эмоциональные отклики в зависимости от используемой палитры.

Хороший выбор цвета требует тщательного планирования.

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

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

Почему ваша цветовая схема так важна?

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

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

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

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

Вот как:

1. Повышение узнаваемости бренда

Ваш сайт — это, по сути, дом вашей компании в Интернете.

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

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

К счастью, цвет повышает узнаваемость бренда на 80%.

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

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

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

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

Конечно, веб-дизайн — это гораздо больше, чем просто цвет.

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

2. Сформируйте отношение посетителей к вашему сайту

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

В определенной степени причина этого ясна.

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

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

Многие компании используют эти связи, как показано логотипами на следующей диаграмме.

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

Это напрямую связано с «индивидуальностью» вашего бренда.

В одном исследовании личности бренда психолог и профессор Стэнфордского университета Дженнифер Аакер пришла к выводу, что пять основных параметров играют роль в индивидуальности бренда:

Бренды иногда могут смешивать черты характера, но по большей части их «индивидуальность» сосредоточена в первую очередь на одном. Например, компания, продающая снаряжение для кемпинга, будет идентифицировать себя с «прочностью», а модный бренд — с «изысканностью».”

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

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

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

Например, синий часто считается самым безопасным выбором.Отчасти это связано с тем, что это самый распространенный «любимый» цвет среди большинства населения.

На самом деле 57% мужчин и 35% женщин считают, что это их любимый цвет.

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

Также стоит отметить, что синий цвет также часто ассоциируется с чувством доверия, авторитета и надежности.

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

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

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

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

3. Развивайте чувство порядка

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

Лучший способ сделать это — изучить несколько основных принципов теории цвета.

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

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

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

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

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

При этом аналогичные цветовые схемы также являются одними из самых ярких.

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

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

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

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

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

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

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

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

Триадная цветовая схема — один из основных вариантов.

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

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

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

4.Выделение определенных элементов

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

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

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

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

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

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

Первое исследование показало, что «предпочтение пар и гармония усиливаются по мере увеличения сходства оттенков». Но, «хотя пары с высококонтрастными оттенками, как правило, не считаются ни предпочтительными, ни гармоничными, рейтинги предпочтений фигурального цвета увеличиваются по мере увеличения контраста оттенка с фоном.”

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

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

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

5. Упростите конструкторские решения

Когда дело доходит до ведения веб-сайта или бизнеса (или того и другого!), Всегда полезно искать способы упростить базовые процессы.

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

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

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

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

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

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

Сколько цветов нужно добавить?

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

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

Как выбрать цветовую схему веб-сайта

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

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

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

16 отличных цветовых палитр для повышения вовлеченности веб-сайтов (2020)

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

1. Меа Чаппа

На веб-сайте Mea Cuppa используется приятная для глаз цветовая палитра, которая включает в себя пару оттенков драгоценных камней (рубиновый и изумрудный) для максимальной живости, но в остальном полагается на нейтральную монохроматическую палитру коричневых и серых тонов.

Палитра веб-дизайна вызывает ощущение кафе и отражается в главном изображении сайта, что создает единство.

2. Большая вершина

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

Основные цвета — это холодные цвета, что делает более теплые цвета яркими. На скриншоте главной страницы вы заметите, что оранжево-желтый призыв к действию привлекает ваше внимание прежде всего.

3.Глаз Тори

Наш третий пример взят из инструмента визуализации Twitter Tori’s Eye. Это отличный пример преимущественно монохромной цветовой схемы. Здесь мы видим эффекты простой, но мощной цветовой палитры, сосредоточенной вокруг оттенков зеленого.

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

4. BarkBox

Доминирующий розовый цвет на домашней странице BarkBox повторяется по всему сайту в разных оттенках.Он красиво контрастирует с синим цветом, который используется в логотипах и призываниях к действию по всему сайту.

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

5. Набор для выживания с сыром

Красный — чрезвычайно популярный цвет для цветовой палитры веб-сайтов. Он может передать богатый набор эмоций, что делает его очень универсальным. Он особенно эффективен при использовании в малых дозах, как вы можете видеть на веб-сайте Cheese Survival Kit.

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

6. Северный рубин

У конференции

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

7. Озеро Нона

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

8. Лимонная стойка

И снова неудивительно, что у компании Lemon Stand будет желтый цвет в цветовой палитре своего веб-сайта. Синий и серый красиво сочетаются с желтым и помогают смягчить его яркость.

9. Монетный двор

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

10. Одопод

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

11. Fiverr

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

12. Школа цифровой фотографии

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

13. Ahrefs

Ahrefs — это пример веб-сайта, который широко использует свою цветовую палитру. Более темный синий цвет является доминирующим, но его вариации существуют повсюду. То же самое касается оранжевого, розового и бирюзового цветов.

14. Millo.co

Millo.co использует очень простую цветовую палитру веб-сайта, и это лучше для нее. Мы точно знаем, где искать, когда посещаем такой сайт.

15.Брайан Гарднер

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

16. Ткацкий станок

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

Удобный список ресурсов для выбора идеальной цветовой палитры веб-сайта

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

Во-первых, нужно ли вам вдохновение?

1: BrandColors

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

Ищете готовую палитру?

2: ColourLovers

ColourLovers — это форум, посвященный дизайну палитр, пользователи которого прислали почти 2 миллиона палитр. Вы можете искать «палитры, включающие этот цвет», просматривать или подписываться на дизайнеров. Часто вы найдете варианты одной и той же палитры, дающие вам готовые варианты оттенка и насыщенности.

(В комплекте с причудливыми названиями.)

3: ColoRotate

ColoRotate поставляется с библиотекой цветовых схем, которые вы можете просматривать, выбирать и изменять.Если вы хотите создать свой собственный с нуля, вы можете это сделать с помощью инструмента 3D-цвета. И вы можете использовать схему, созданную вами прямо в PhotoShop или Fireworks, с плагином ColorRotate и приложением для iPad.

Соответствие вашему бренду

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

4: Охотник за цветом

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

5: Живописный

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

Эти инструменты будут генерировать целые цветовые палитры.

6: Цветовое колесо Adobe Color CC

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

7: Палетон

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

8: Color Spire

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

9: Цветовая сфера MudCube

(Источник: http://htmlcolorcodes.com/resources/best-color-palette-generators/)

MudCube’s Color Sphere — это плагин Chrome, который помогает гармонизировать цвета, контролировать дальтонизм и определять шестнадцатеричные коды. Вы также можете экспортировать цветовые схемы прямо в Illustrator, PhotoShop и CoIRD.com.

10: когезионные цвета

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

11: Генератор шестнадцатеричных цветовых схем

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

Создайте свои цвета

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

12: Цветное приложение

Этот инструмент iOS позволяет принимать точные решения между похожими цветами, четко распределяя их с некоторым промежутком между ними, а не градиентами, как в цветовых кругах и сферах. Большие цветные сетки позволяют использовать весь экран (пользователи iPad Pro, радуйтесь!), А также позволяют выбирать цвета, находить значения RGB, Hex и HSLA и создавать цветовые палитры с нуля.

13: Цвет

Color от HailPixel позволяет вам точно определить, какой цвет вы хотите, а затем дает вам шестнадцатеричный код для него.

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

Получить коды для цвета

Если вы где-то видели цвет и не знаете, как его назвать, это инструменты для вас.

14: SpyColor

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

15: цветовые коды HTML

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

Проверьте свою палитру

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

16: Проверь мои цвета

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

… который в основном просматривает весь код вашего сайта и оценивает все визуальные элементы на нем по видимости.

Соответствующие изображения

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

17: TinEye

TinEye более известен как альтернатива поиску картинок Google. Но он также работает как способ изучения цветовых комбинаций, используя базу данных из более чем 10 миллионов лицензионных фотографий Creative Commons, собранных с Flickr.Если вы ищете изображения с идеальной цветовой комбинацией, это отличный и простой в использовании способ их найти.

18: Дизайн

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

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

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

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

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

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

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

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

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

Вы не узнаете, пока не протестируете.

Начать использовать Crazy Egg

Создайте бесплатную учетную запись Crazy Egg, чтобы начать бесплатную пробную версию, или войдите в систему, чтобы настроить отчеты о поведении пользователей.

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

Заключение

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

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

Изменить цвета на сайте очень просто. Если вы знаете HTML, вы можете вручную изменять HEX-коды в файлах темы. Многие темы WordPress также поставляются с настройщиками, которые позволяют изменять цвета, не зная кода.

Дайте себе возможность сделать свой сайт максимально привлекательным и запоминающимся.

лучших генераторов цветовых схем

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

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

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

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

Coolors.co — Быстрый генератор цветовых схем

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

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

Если у вас уже есть цвет, для которого вы пытаетесь найти соответствие, вы можете ввести шестнадцатеричное значение и настроить компоненты RGB, HSB, CMYK, Pantone и Copic.Вы даже можете выбрать определенный цвет из изображения или заполнить всю палитру из этого изображения. Также можно выбрать разные оттенки цвета и настроить оттенок, насыщенность, яркость и многое другое.

После выбора палитры совпадающих цветов ее можно экспортировать как SVG, PNG, PDF или SCSS, или вы можете просто скопировать URL-адрес или добавить его в закладки для дальнейшего использования. Мне очень нравится функция прямых ссылок, так как вам не нужно создавать профиль для использования сайта. Однако вы можете создать профиль на сайте, а затем сохранить там все свои цветовые схемы.

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

HueSnap — извлечение цветов из фотографий

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

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

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

Инструмент цвета материала для дизайна — специальные возможности

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

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

Adobe Color — Старый добрый инструмент, но обновленный новыми функциями

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

Если вы являетесь пользователем Adobe Creative Cloud, вы также можете сохранить цветовые темы для использования непосредственно в своих проектах.

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

Colourco — Простое комбинирование цветов

Colourco немного похоже на Coolors.co, но вместо случайной палитры цветов вы перемещаете мышь. Переместите мышь вверх для более темных цветов и вниз для более светлых, влево и вправо для регулировки RGB. Можно продолжать добавлять цвета, нажимая символ +.

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

Если у вас есть палитра, которая соответствует вашим потребностям, ее легко сохранить как таблицу стилей SCSS, палитру PNG или как URL-адрес.

Palettte

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

Вы можете экспортировать и импортировать палитру в формате JSON.

Статьи и теория цвета

Цвета Canva — основы

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

Цвет имеет значение — интернет-ресурс по теории цвета

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

Color things, вероятно, один из лучших сайтов, где вы можете бесплатно узнать о цветах. Автор — консультант по цвету, работал в списке компаний из списка Fortune 500 и преподавал в университете.

Цветные онлайн-курсы

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

Веб-дизайн в целом

Awwwards

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

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

Веб-агентство

Webkilde Webbureau — небольшое датское веб-агентство, специализирующееся на быстрых и оптимизированных веб-сайтах.Компания предлагает дизайн White Label для других веб-агентств и веб-дизайнеров.

У вас есть дизайн в Adobe XD или аналогичном и вы хотите преобразовать его в статическую домашнюю страницу или тему WordPress? Тогда вы можете сделать это здесь. Тем не менее, вы, вероятно, также можете получить достойную работу на freelancer.com или fiveer.com за меньшие деньги.

Smashing Magazine

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

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

A List Apart

A List Apart существует как всегда. Есть несколько хороших статей о дизайне, разработке и веб-контенте.

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

36 красивых цветовых палитр для вашего следующего проекта дизайна

Ищете цветовые палитры для вашего пользовательского интерфейса? Color Hex — полезный онлайн-инструмент с коллекцией из почти 40 000 цветовых палитр, которые вы можете использовать в своих проектах.Вы можете копировать шестнадцатеричные коды и даже загружать версию каждой палитры в формате .PNG. Ознакомьтесь с некоторыми из наших фаворитов ниже.

1. Пляжные полотенца

# fe4a49 • # 2ab7ca • # fed766 • # e6e6ea • # f4f4f8

2. Светло-розовый

# eee3e7 • # ead5dc • # eec9d2 • # f4b6c2 • # f6abb6

3. Красивый блюз

# 011f4b • # 03396c • # 005b96 • # 6497b1 • # b3cde0

4. Так много потерянных песен

# 051e3e • # 251e3e • # 451e3e • # 651e3e • # 851e3e

5.Она

# dec3c3 • # e7d3d3 • # f0e4e4 • # f9f4f4 • #ffffff

6. Байт лунного света 6

# 4a4e4d • # 0e9aa7 • # 3da4ab • # f6cd61 • # fe8a71

7. Число 3

# 2a4d69 • # 4b86b4 • # adcbe3 • # e7eff6 • # 63ace5

8. Пастель

# fe9c8f • # feb2a8 • # fec8c1 • # fad9c1 • # f9caa7

9. Android Lollipop

# 009688 • # 35a79c • # 54b2a9 • # 65c3ba • # 83d0c9

10. Радуга Дэш

# ee4035 • # f37736 • # fdf498 • # 7bc043 • # 0392cf

11.Оттенки белого

# faf0e6 • # fff5ee • # fdf5e6 • # faf0e6 • # faebd7

12. Корзина черники

#ffffff • # d0e1f9 • # 4d648d • # 283655 • # 1e1f26

13. Пять оттенков серого

#eeeeee • #dddddd • #cccccc • #bbbbbb • #aaaaaa

14. Аниме оттенки кожи

# ffe9dc • # fce9db • # e0a899 • # dfa290 • # c99789

15. Пляж

# 96ceb4 • #ffeead • # ff6f69 • # ffcc5c • # 88d8b0

16. Сине-серый

# 6e7f80 • # 536872 • # 708090 • # 536878 • # 36454f

17.Капучино

# 4b3832 • # 854442 • # fff4e6 • # 3c2f2f • # be9b7b

18. Facebook

# 3b5998 • # 8b9dc3 • # dfe3ee • # f7f7f7 • #ffffff

19. Google Цвета

# 008744 • # 0057e7 • # d62d20 • # ffa700 • #ffffff

20. Серо-синий

# 3385c6 • # 4279a3 • # 476c8a • # 49657b • # 7f8e9e

21. Серо-лавандовые цвета

# d2d4dc • #afafaf • # f8f8fa • # e5e6eb • # c0c2ce

22. Пастельная радуга

# a8e6cf • # dcedc1 • # ffd3b6 • ​​# ffaaa5 • # ff8b94

23.Цвета Metro UI

# d11141 • # 00b159 • # 00aedb • # f37735 • # ffc425

24. Грейсо

# 6f7c85 • # 75838d • # 7e8d98 • # 8595a1 • # 8c9da9

25. Водонос

# ebf4f6 • #bdeaee • # 76b4bd • # 58668b • # 5e5656

26. розовый

# ff77aa • # ff99cc • #ffbbee • # ff5588 • # ff3377

27. Никогда не сомневаюсь

#eeeeee • #dddddd • #cccccc • #bbbbbb • # 29a8ab

28. Никогда не мечтала об этом

# fff6e9 • # ffefd7 • # fffef9 • # e3f0ff • # d2e7ff

29.Каталог программ

# edc951 • # eb6841 • # cc2a36 • # 4f372d • # 00a0b0

30. Кабинет 2

# 84c1ff • # add6ff • # d6eaff • # eaf4ff • # f8fbff

31. Пурпурный горизонт

# 2e003e • # 3d2352 • # 3d1e6d • # 8874a3 • # e4dcf1

32. Оттенки кожи

# 8d5524 • # c68642 • # e0ac69 • # f1c27d • #ffdbac

33. Серый космос

# 343d46 • # 4f5b66 • # 65737e • # a7adba • # c0c5ce

34. Падение брони

# bfd6f6 • # 8dbdff • # 64a1f4 • # 4a91f2 • # 3b7dd8

35.Белый

#fdfbfb • #fbfdfb • #fdfdff • # fdf9f9 • #fdfbfb

36. Кожа запястья

# e3c9c9 • # f4e7e7 • #eedbdb • #cecbcb • #cbdadb

ПОДРОБНЕЕ…

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

Color Tools — Sherwin-Williams

Color Tools — Sherwin-Williams Диалог сообщений Показать сообщение об обновлении

Сделайте свою работу проще с помощью лучших профессиональных инструментов для выбора цвета от Sherwin-Williams.

Канада

Мексика

Общая информация

Наши продукты доступны по всей Южной Америке, см. Адреса ниже или свяжитесь с нами по адресу [email protected].

Аргентина

Наши продукты доступны по всей Южной Америке, см. Адреса ниже или свяжитесь с нами по адресу [email protected].

Бразилия

Наши продукты доступны по всей Южной Америке, см. Адреса ниже или свяжитесь с нами по адресу globalsales @ sherwin.com.

Чили

Наши продукты доступны по всей Южной Америке, см. Адреса ниже или свяжитесь с нами по адресу [email protected].

Колумбия

Наши продукты доступны по всей Южной Америке, см. Адреса ниже или свяжитесь с нами по адресу [email protected].

Эквадор

Наши продукты доступны по всей Южной Америке, см. Адреса ниже или свяжитесь с нами по адресу [email protected].

Уругвай

Наши продукты доступны по всей Южной Америке, см. Адреса ниже или свяжитесь с нами по адресу globalsales @ sherwin.com.

Общая информация

Наши продукты доступны по всей Центральной Америке, см. Адреса ниже или свяжитесь с нами по адресу [email protected].

Коста-Рика

Наши продукты доступны по всей Центральной Америке, см. Адреса ниже или свяжитесь с нами по адресу [email protected].

Сальвадор

Наши продукты доступны по всей Центральной Америке, см. Адреса ниже или свяжитесь с нами по адресу globalsales @ sherwin.com.

Гватемала

Наши продукты доступны по всей Центральной Америке, см. Адреса ниже или свяжитесь с нами по адресу [email protected].

Гондурас

Наши продукты доступны по всей Центральной Америке, см. Адреса ниже или свяжитесь с нами по адресу [email protected].

Мексика

Наши продукты доступны по всей Центральной Америке, см. Адреса ниже или свяжитесь с нами по адресу [email protected].

Никарагуа

Наши продукты доступны по всей Центральной Америке, см. Адреса ниже или свяжитесь с нами по адресу [email protected].

Панама

Наши продукты доступны по всей Центральной Америке, см. Адреса ниже или свяжитесь с нами по адресу [email protected].

Общая информация

Наши продукты доступны по всему Карибскому региону, см. Адреса ниже или свяжитесь с нами по адресу [email protected].

Багамы

Наши продукты доступны по всему Карибскому региону, см. Адреса ниже или свяжитесь с нами по адресу [email protected].

Bermuda

Наши продукты доступны по всему Карибскому региону, см. Адреса ниже или свяжитесь с нами по адресу [email protected].

Бонайре, Синт-Эстатиус и Саба

Наши продукты доступны по всему Карибскому региону, см. Адреса ниже или свяжитесь с нами по адресу [email protected].

Каймановы острова

Наши продукты доступны по всему Карибскому региону, см. Адреса ниже или свяжитесь с нами по адресу [email protected].

Доминиканская Республика

Наши продукты доступны по всему Карибскому региону, см. Адреса ниже или свяжитесь с нами по адресу [email protected].

Гаити

Наши продукты доступны по всему Карибскому региону, см. Адреса ниже или свяжитесь с нами по адресу [email protected].

Ямайка

Наши продукты доступны по всему Карибскому региону, см. Адреса ниже или свяжитесь с нами по адресу globalsales @ sherwin.com.

Пуэрто-Рико

Наши продукты доступны по всему Карибскому региону, см. Адреса ниже или свяжитесь с нами по адресу [email protected].

Сент-Китс и Невис

Наши продукты доступны по всему Карибскому региону, см. Адреса ниже или свяжитесь с нами по адресу [email protected].

Острова Теркс и Кайкос

Наши продукты доступны по всему Карибскому региону, см. Адреса ниже или свяжитесь с нами по адресу globalsales @ sherwin.com.

Виргинские острова (Британские)

Наши продукты доступны по всему Карибскому региону, см. Адреса ниже или свяжитесь с нами по адресу [email protected].

Другие островные страны Карибского бассейна

Наши продукты доступны по всему Карибскому региону, см. Адреса ниже или свяжитесь с нами по адресу [email protected].

Общая информация

Наши продукты доступны во всем Азиатско-Тихоокеанском регионе, см. Адреса ниже или свяжитесь с нами по адресу globalsales @ sherwin.com.

Китай

Наши продукты доступны во всем Азиатско-Тихоокеанском регионе, см. Адреса ниже или свяжитесь с нами по адресу [email protected].

Индонезия

Наши продукты доступны во всем Азиатско-Тихоокеанском регионе, см. Адреса ниже или свяжитесь с нами по адресу [email protected].

Япония

Наши продукты доступны во всем Азиатско-Тихоокеанском регионе, см. Адреса ниже или свяжитесь с нами по адресу [email protected].

Малайзия

Наши продукты доступны во всем Азиатско-Тихоокеанском регионе, см. Адреса ниже или свяжитесь с нами по адресу globalsales @ sherwin.com.

Сингапур

Наши продукты доступны во всем Азиатско-Тихоокеанском регионе, см. Адреса ниже или свяжитесь с нами по адресу [email protected].

Южная Корея

Наши продукты доступны во всем Азиатско-Тихоокеанском регионе, см. Адреса ниже или свяжитесь с нами по адресу [email protected].

Таиланд

Наши продукты доступны во всем Азиатско-Тихоокеанском регионе, см. Адреса ниже или свяжитесь с нами по адресу [email protected].

Вьетнам

Наши продукты доступны во всем Азиатско-Тихоокеанском регионе, см. Адреса ниже или свяжитесь с нами по адресу globalsales @ sherwin.com.

Общая информация

Наши продукты доступны по всей Европе, см. Адреса ниже или свяжитесь с нами по адресу [email protected].

Хорватия

Наши продукты доступны по всей Европе, см. Адреса ниже или свяжитесь с нами по адресу [email protected].

Кипр

Наши продукты доступны по всей Европе, см. Адреса ниже или свяжитесь с нами по адресу [email protected].

Чешская Республика

Наши продукты доступны по всей Европе, см. Адреса ниже или свяжитесь с нами по адресу globalsales @ sherwin.com.

Дания

Наши продукты доступны по всей Европе, см. Адреса ниже или свяжитесь с нами по адресу [email protected].

Общие промышленные покрытия

Danske

Промышленные покрытия для древесины

Danske

Упаковочные покрытия

Английский

Защитные и морские покрытия

Danske

Финляндия

свяжитесь с нами по адресу globalsales @ sherwin.com.

Общие промышленные покрытия

Suomi

Промышленные покрытия для древесины

Suomi

Упаковочные покрытия

Английский

Защитные и морские покрытия

Suomi

Франция

Наши местоположения доступны ниже или по всей Европе. свяжитесь с нами по адресу [email protected].

Германия

Наши продукты доступны по всей Европе, см. Адреса ниже или свяжитесь с нами по адресу globalsales @ sherwin.com.

Венгрия

Наши продукты доступны по всей Европе, см. Адреса ниже или свяжитесь с нами по адресу [email protected].

Италия

Наши продукты доступны по всей Европе, см. Адреса ниже или свяжитесь с нами по адресу [email protected].

Литва

Наши продукты доступны по всей Европе, см. Адреса ниже или свяжитесь с нами по адресу [email protected].

Норвегия

Наши продукты доступны по всей Европе, см. Адреса ниже или свяжитесь с нами по адресу globalsales @ sherwin.com.

General Industrial Coatings

Norsk

Industrial Wood Coatings

Norsk

Packaging Coatings

English

Protective & Marine Coatings

Nynorsk

Наши местоположения доступны по всей Европе или по всей Польше

свяжитесь с нами по адресу [email protected].

Общие промышленные покрытия

Polski

Промышленные покрытия для древесины

Polski

Упаковочные покрытия

Английский

Защитные и морские покрытия

Polski

Португалия

свяжитесь с нами по адресу globalsales @ sherwin.com.

Румыния

Наши продукты доступны по всей Европе, см. Адреса ниже или свяжитесь с нами по адресу [email protected].

Россия

Наши продукты доступны по всей Европе, см. Адреса ниже или свяжитесь с нами по адресу [email protected].

Сербия

Наши продукты доступны по всей Европе, см. Адреса ниже или свяжитесь с нами по адресу [email protected].

Словакия

Наши продукты доступны по всей Европе, см. Адреса ниже или свяжитесь с нами по адресу globalsales @ sherwin.com.

Словения

Наши продукты доступны по всей Европе, см. Адреса ниже или свяжитесь с нами по адресу [email protected].

Испания

Наши продукты доступны по всей Европе, см. Адреса ниже или свяжитесь с нами по адресу [email protected].

Швеция

Наши продукты доступны по всей Европе, см. Адреса ниже или свяжитесь с нами по адресу [email protected].

Украина

Наши продукты доступны по всей Европе, см. Адреса ниже или свяжитесь с нами по адресу globalsales @ sherwin.com.

Великобритания

Наши продукты доступны по всей Европе, см. Адреса ниже или свяжитесь с нами по адресу [email protected].

Ближний Восток

Наши продукты доступны по всему Ближнему Востоку, см. Адреса ниже или свяжитесь с нами по адресу globalsales@sherwin.

No related posts.