Get Color — палитра цветов, определить цвет онлайн
ColorGet - программа для определения цвета на экране
Утилита ColorGet позволяет определить цвет пикселя не только на фото или картинке, но и на любой рабочей поверхности. Программа работает без установки. Просто скачайте архив и распакуйте. Скачать ColorGet
Названия цветов и html коды
Ализариновый красный, Alizarin Crimson, #E32636
Янтарный, Amber, #FFBF00
Аметистовый, Amethyst, #9966CC
Спаржа, Asparagus, #7BA05B
Морской волны, Aqua, #00FFFF
Аквамариновый, Aquamarine, #7FFFD4
Лазурный, Azure, #007FFF
Бежевый, Beige, #F5F5DC
Бистр, Bistre, #3D2B1F
Чёрный, Black, #000000
Синий, Blue, #0000FF
Вода пляжа Бонди, Bondi Blue, #0095B6
Латунный, Brass, #B5A642
Ярко-зелёный, Bright green, #66FF00
Ярко-бирюзовый, Bright turquoise, #08E8DE
Ярко-фиолетовый, Bright violet, #CD00CD
Бронзовый, Bronze, #CD7F32
Коричневый, Brown, #964B00
Кожа буйвола, Buff, #F0DC82
Бургундский, Burgundy, #900020
Выгоревший оранжевый, Burnt Orange, #CC5500
Сиена жжёная, Burnt Sienna, #E97451
Умбра жжёная, Burnt umber, #8A3324
Камуфляжный зелёный, Camouflage green, #78866B
Кардинал, Cardinal, #C41E3A
Карминово-красный, Carmine, #960018
Морковный, Carrot, #ED9121
Серо-зелёный, Celadon, #ACE1AF
Светлая вишня, Cerise, #DE3163
Лазурный, Cerulean, #007BA7
Лазурно-синий, Cerulean blue, #2A52BE
Салатовый / Шартрез, Chartreuse, #7FFF00
Каштановый, Chestnut, #CD5C5C
Шоколадный, Chocolate, #D2691E
Коричневый, Cinnamon, #7B3F00
Кобальт синий, Cobalt, #0047AB
Медный, Copper, #B87333
Коралловый, Coral, #FF7F50
Кукурузный, Corn, #FBEC5D
Васильковый, Cornflower blue, #6495ED
Кремовый, Cream, #FFFDD0
Малиновый, Crimson, #DC143C
Циан, васильковый, Cyan, #00FFFF
Тёмно-коричневый, Dark brown, #654321
Тёмно-лазурный, Dark cerulean, #08457E
Тёмно-каштановый, Dark chestnut, #986960
Тёмно-коралловый, Dark coral, #CD5B45
Тёмно-золотой, Dark goldenrod, #B8860B
Тёмно-зелёный, Dark green, #013220
Тёмный индиго, Dark Indigo, #310062
Тёмный хаки, Dark Khaki, #BDB76B
Тёмно-оливковый, Dark Olive, #556832
Тёмный пастельно-зелёный, Dark pastel green, #03C03C
Тёмно-персиковый, Dark Peach, #FFDAB9
Тёмно-розовый, Dark pink, #E75480
Тёмная лососина, Dark salmon, #E9967A
Тёмно-алый, Dark Scarlet, #560319
Тёмно-аспидный серый, Dark slate gray, #2F4F4F
Тёмный весенне-зелёный, Dark spring green, #177245
Тёмный жёлто-коричневый, Dark tan, #918151
Тёмно-мандариновый, Dark tangerine, #FFA812
Тёмный зелёный чай, Dark Tea Green, #BADBAD
Тёмно-бирюзовый, Dark turquoise, #116062
Тёмно-фиолетовый, Dark violet, #423189
Голубой, Deep sky blue, #00BFFF
Джинсовый синий, Denim, #1560BD
Защитно-синий, Dodger blue, #1E90FF
Изумрудный, Emerald, #50C878
Баклажановый, Eggplant, #990066
Зелёный папоротник, Fern green, #4F7942
Льняной, Flax, #EEDC82
Фуксия, Magenta (Fuchsia), #FF00FF
Гуммигут, Gamboge, #E49B0F
Золотой, Gold, #FFD700
Золотисто-берёзовый, Goldenrod, #DAA520
Серый, Gray, #808080
Серая спаржа, Gray-asparagus, #465945
Зелёный серый чай, Gray-Tea Green, #CADABA
Зелёный, Green, #00FF00
Жёлто-зелёный, Green-yellow, #ADFF2F
Синий Градуса, Gradus Blue, #007DFF
Гелиотроп, Heliotrope, #DF73FF
Ярко-розовый, Hot pink, #FC0FC0
Индиго, Indigo, #4B0082
Международный (сигнальный) оранжевый, International orange (Safety orange), #FF4F00
Цвета HTML. Таблица из 147 имён цветов для HTML и CSS — ColorScheme.Ru
HTML Имя Цвета
HEX
RGB
Красные тона:
IndianRed
#CD5C5C
205, 92, 92
LightCoral
#F08080
240, 128, 128
Salmon
#FA8072
250, 128, 114
DarkSalmon
#E9967A
233, 150, 122
LightSalmon
#FFA07A
255, 160, 122
Crimson
#DC143C
220, 20, 60
Red
#FF0000
255, 0, 0
FireBrick
#B22222
178, 34, 34
DarkRed
#8B0000
139, 0, 0
Розовые тона:
Pink
#FFC0CB
255, 192, 203
LightPink
#FFB6C1
255, 182, 193
HotPink
#FF69B4
255, 105, 180
DeepPink
#FF1493
255, 20, 147
MediumVioletRed
#C71585
199, 21, 133
PaleVioletRed
#DB7093
219, 112, 147
Оранжевые тона:
LightSalmon
#FFA07A
255, 160, 122
Coral
#FF7F50
255, 127, 80
Tomato
#FF6347
255, 99, 71
OrangeRed
#FF4500
255, 69, 0
DarkOrange
#FF8C00
255, 140, 0
Orange
#FFA500
255, 165, 0
Жёлтые тона:
Gold
#FFD700
255, 215, 0
Yellow
#FFFF00
255, 255, 0
LightYellow
#FFFFE0
255, 255, 224
LemonChiffon
#FFFACD
255, 250, 205
LightGoldenrodYellow
#FAFAD2
250, 250, 210
PapayaWhip
#FFEFD5
255, 239, 213
Moccasin
#FFE4B5
255, 228, 181
PeachPuff
#FFDAB9
255, 218, 185
PaleGoldenrod
#EEE8AA
238, 232, 170
Khaki
#F0E68C
240, 230, 140
DarkKhaki
#BDB76B
189, 183, 107
Фиолетовые тона:
Lavender
#E6E6FA
230, 230, 250
Thistle
#D8BFD8
216, 191, 216
Plum
#DDA0DD
221, 160, 221
Violet
#EE82EE
238, 130, 238
Orchid
#DA70D6
218, 112, 214
Fuchsia
#FF00FF
255, 0, 255
Magenta
#FF00FF
255, 0, 255
MediumOrchid
#BA55D3
186, 85, 211
MediumPurple
#9370DB
147, 112, 219
BlueViolet
#8A2BE2
138, 43, 226
DarkViolet
#9400D3
148, 0, 211
DarkOrchid
#9932CC
153, 50, 204
DarkMagenta
#8B008B
139, 0, 139
Purple
#800080
128, 0, 128
Indigo
#4B0082
75, 0, 130
SlateBlue
#6A5ACD
106, 90, 205
DarkSlateBlue
#483D8B
72, 61, 139
Коричневые тона:
Cornsilk
#FFF8DC
255, 248, 220
BlanchedAlmond
#FFEBCD
255, 235, 205
Bisque
#FFE4C4
255, 228, 196
NavajoWhite
#FFDEAD
255, 222, 173
Wheat
#F5DEB3
245, 222, 179
BurlyWood
#DEB887
222, 184, 135
Tan
#D2B48C
210, 180, 140
RosyBrown
#BC8F8F
188, 143, 143
SandyBrown
#F4A460
244, 164, 96
Goldenrod
#DAA520
218, 165, 32
DarkGoldenRod
#B8860B
184, 134, 11
Peru
#CD853F
205, 133, 63
Chocolate
#D2691E
210, 105, 30
SaddleBrown
#8B4513
139, 69, 19
Sienna
#A0522D
160, 82, 45
Brown
#A52A2A
165, 42, 42
Maroon
#800000
128, 0, 0
Основные цвета:
Black
#000000
0, 0, 0
Gray
#808080
128, 128, 128
Silver
#C0C0C0
192, 192, 192
White
#FFFFFF
255, 255, 255
Fuchsia
#FF00FF
255, 0, 255
Purple
#800080
128, 0, 128
Red
#FF0000
255, 0, 0
Maroon
#800000
128, 0, 0
Yellow
#FFFF00
255, 255, 0
Olive
#808000
128, 128, 0
Lime
#00FF00
0, 255, 0
Green
#008000
0, 128, 0
Aqua
#00FFFF
0, 255, 255
Teal
#008080
0, 128, 128
Blue
#0000FF
0, 0, 255
Navy
#000080
0, 0, 128
HTML Имя Цвета
HEX
RGB
Зелёные тона:
GreenYellow
#ADFF2F
173, 255, 47
Chartreuse
#7FFF00
127, 255, 0
LawnGreen
#7CFC00
124, 252, 0
Lime
#00FF00
0, 255, 0
LimeGreen
#32CD32
50, 205, 50
PaleGreen
#98FB98
152, 251, 152
LightGreen
#90EE90
144, 238, 144
MediumSpringGreen
#00FA9A
0, 250, 154
SpringGreen
#00FF7F
0, 255, 127
MediumSeaGreen
#3CB371
60, 179, 113
SeaGreen
#2E8B57
46, 139, 87
ForestGreen
#228B22
34, 139, 34
Green
#008000
0, 128, 0
DarkGreen
#006400
0, 100, 0
YellowGreen
#9ACD32
154, 205, 50
OliveDrab
#6B8E23
107, 142, 35
Olive
#808000
128, 128, 0
DarkOliveGreen
#556B2F
85, 107, 47
MediumAquamarine
#66CDAA
102, 205, 170
DarkSeaGreen
#8FBC8F
143, 188, 143
LightSeaGreen
#20B2AA
32, 178, 170
DarkCyan
#008B8B
0, 139, 139
Teal
#008080
0, 128, 128
Синие тона:
Aqua
#00FFFF
0, 255, 255
Cyan
#00FFFF
0, 255, 255
LightCyan
#E0FFFF
224, 255, 255
PaleTurquoise
#AFEEEE
175, 238, 238
Aquamarine
#7FFFD4
127, 255, 212
Turquoise
#40E0D0
64, 224, 208
MediumTurquoise
#48D1CC
72, 209, 204
DarkTurquoise
#00CED1
0, 206, 209
CadetBlue
#5F9EA0
95, 158, 160
SteelBlue
#4682B4
70, 130, 180
LightSteelBlue
#B0C4DE
176, 196, 222
PowderBlue
#B0E0E6
176, 224, 230
LightBlue
#ADD8E6
173, 216, 230
SkyBlue
#87CEEB
135, 206, 235
LightSkyBlue
#87CEFA
135, 206, 250
DeepSkyBlue
#00BFFF
0, 191, 255
DodgerBlue
#1E90FF
30, 144, 255
CornflowerBlue
#6495ED
100, 149, 237
MediumSlateBlue
#7B68EE
123, 104, 238
RoyalBlue
#4169E1
65, 105, 225
Blue
#0000FF
0, 0, 255
MediumBlue
#0000CD
0, 0, 205
DarkBlue
#00008B
0, 0, 139
Navy
#000080
0, 0, 128
MidnightBlue
#191970
25, 25, 112
Белые тона:
White
#FFFFFF
255, 255, 255
Snow
#FFFAFA
255, 250, 250
Honeydew
#F0FFF0
240, 255, 240
MintCream
#F5FFFA
245, 255, 250
Azure
#F0FFFF
240, 255, 255
AliceBlue
#F0F8FF
240, 248, 255
GhostWhite
#F8F8FF
248, 248, 255
WhiteSmoke
#F5F5F5
245, 245, 245
Seashell
#FFF5EE
255, 245, 238
Beige
#F5F5DC
245, 245, 220
OldLace
#FDF5E6
253, 245, 230
FloralWhite
#FFFAF0
255, 250, 240
Ivory
#FFFFF0
255, 255, 240
AntiqueWhite
#FAEBD7
250, 235, 215
Linen
#FAF0E6
250, 240, 230
LavenderBlush
#FFF0F5
255, 240, 245
MistyRose
#FFE4E1
255, 228, 225
Серые тона:
Gainsboro
#DCDCDC
220, 220, 220
LightGrey
#D3D3D3
211, 211, 211
LightGray
#D3D3D3
211, 211, 211
Silver
#C0C0C0
192, 192, 192
DarkGray
#A9A9A9
169, 169, 169
DarkGrey
#A9A9A9
169, 169, 169
Gray
#808080
128, 128, 128
Grey
#808080
128, 128, 128
DimGray
#696969
105, 105, 105
DimGrey
#696969
105, 105, 105
LightSlateGray
#778899
119, 136, 153
LightSlateGrey
#778899
119, 136, 153
SlateGray
#708090
112, 128, 144
SlateGrey
#708090
112, 128, 144
DarkSlateGray
#2F4F4F
47, 79, 79
DarkSlateGrey
#2F4F4F
47, 79, 79
Black
#000000
0, 0, 0
colorscheme.ru
Как определить цвет на сайте
Приветствую вас на сайте Impuls-Web!
В данной статье я расскажу вам, как можно определить цвет элемента на сайте.
Для чего это может понадобиться? Предположим, вы редактируете какой-то элемент, либо добавляете новый и вам нужно сделать, что бы он подходил по цветовому оформлению к вашему сайту.
Навигация по статье:
В моем случае, в качестве такого элемента будет выступать кнопка «Отправить заявку»
Для того, что бы она лучше подходила по оформлению к этому сайту, я хочу сделать, что бы ее цвет фона совпадал с цветом меню. Конечно, для точного определения цвета можно использовать какой-нибудь графический редактор типа Photoshop или его аналогов. Однако, есть способы определить цвет с намного меньшими затратами времени и усилий.
Определение цвета стандартными инструментами браузера
Я буду показывать, как это можно сделать на примере браузера Mozilla Firefox и Google Chrome. Здесь, для того, что бы определить цвет какого-то элемента я могу щелкнуть правой кнопкой мыши по тому элементу, для которого я хочу задать цвет и в раскрывающемся списке выбрать здесь пункт «Исследовать элемент».
При этом, в нижней части экрана откроется окно инспектора, где можно просматривать код страницы, а так же css-свойства, которые задаются для каждого элемента.
Для данной кнопки у меня отображается в качестве фона серый цвет и если щёлкнуть левой кнопкой мышки по кружочку с цветом, то откроется вот такая палитра:
При помощи данной палитры также можно подбирать нужный цвет, но для точного определения цвета нужно:
1.Кликнуть на значок пипетки
2.Навести курсор на тот элемент сайта, цвет которого мы хотим определить. В данном случае это будет меню.
Обратите внимание, что возле курсора появляется увеличивающаяся область, благодаря которой мы можем определить цвет даже для каких-то не больших элементов на странице сайта.
3.После того, как вы выбрали тот цвет, который вам нужен, просто нажимаете левую кнопку мышки. Сразу же после этого значение цвета того элемента, для которого вы инспектировали свойства, изменится. И эти изменения вы можете сразу же увидеть на предпросмотре.
Кнопка «Отправить заявку» сразу же стала такого же цвета, как и меню. Однако для того, что бы эти изменения сохранились и применились на сайте, вам нужно скопировать значение данного цвета на панели отображения css-свойств, и затем вставить его в файл стилей вашей темы style.css.
Для этого вы можете воспользоваться либо визуальным редактором WordPress, либо какой-то другой программой для редактирования кода.
Изменения нужно вносить в файл:
/wp-content/themes/название вашей темы/style.css
Все изменения вносим в самый конец файла.
Для смены фона данного элемента нужно определить его класс или идентификатор. Как это делать я показывала в этой статье.
Затем, для этого элемента нужно задать свойство background, и вставить значение того цвета, который мы только что определили. После этого нужно сохранить изменения.
В файле style.css это будет выглядеть примерно так:
.test-btn{ background:# #2F73B6; }
.test-btn{
background:# #2F73B6;
}
Только вместо test-btn будет значение класса или идентификатора вашего элемента.
Определение цвета в браузере Google Chrome
В браузере Google Chrome процесс определения цвета будет выглядеть аналогичным образом.
1.Точно так же щелкаем правой кнопкой мышки по интересующему нас элементу.
2.Выбираем пункт «Просмотреть код»
3.Далее, у нас открывается аналогичный инспектор. Единственное, у вас он может быть как в горизонтальном расположении, как у меня, так и в вертикальном, когда панель будет находиться справа.
4.Здесь мы находим панель отображения css-свойств, и нажимаем на значок одного из цветов. = cvet6=
5.Далее, у нас открывается инструмент определения цвета, который, в принципе, похож на тот, который был в Mozilla Firefox. Единственное, что здесь еще можно задавать прозрачность цвета, выбирать цветовую гамму, и так же он может определять цвета не только в шестнадцатеричном формате, но и в формате RGB и RGBA.
6.Для точного определения цвета так же нажимаем на значок пипетки, наводим курсор на тот элемент, цвет которого мы хотим определить, и щелкаем левой кнопкой мыши.
При этом, здесь сразу же отображается его цвет. Если нам нужен другой формат цвета, то мы можем изменить его при помощи стрелочек вверх и вниз.
7.Точно так же, копируем значение этого цвета, и затем вставляем его в наш css-файл.
Как и в Mozilla Firefox, после того как мы выбрали цвет в окне предпросмотра элемент подсветился таким же цветом, который мы выбрали. Однако при обновлении страницы все эти изменения исчезнут, и цвет станет таким же, как он задан в css изначально. То есть, для того, что бы эта кнопка стала такого же цвета, как и меню на сайте, мне нужно внести изменения в css-файл.
Использование пипетки в Mozilla Firefox
Так же, в браузере Mozilla Firefox есть специальный инструмент для определения цвета, который называется «Пипетка». Для того чтобы им воспользоваться нужно:
1.В правом верхнем углу нажимаем на значок меню, затем, выбираем раздел «Разработка», и здесь выбираем инструмент «Пипетка».
2.У нас появляется вот такое увеличительное стекло, при помощи которого мы можем определять цвет.
3.После того, как мы навели курсор на тот элемент, у которого нужно определить цвет, щелкаем левой кнопкой мышки и значение этого цвета автоматически копируется в буфер обмена.
4.Затем, мы просто переходим в css-файл и вставляем это значение.
На мой взгляд, этот способ более удобный, чем определение цвета через инспектор. Потому что он, во-первых немножко быстрее, а во-вторых – значение инспектора сразу же копируется в буфер обмена.
Определение цвета при помощи специальной программы
Так же, помимо инструментов браузера существуют специальные программки, которые так же позволяют легко определять значение цвета. Я для этих целей использую программу Pixie. Она не устанавливается, то есть вы просто копируете ее к себе на компьютер, а затем, при необходимости, просто запускаете двойным щелчком мыши, и у вас появляется вот такое окошко:
Которое вы можете разместить в любой части экрана, что бы оно вам не мешало. При этом когда вы водите курсором по изображению – в специальном окошке показываются выбранный цвет.
Плюс этой программы в том, что вы можете определять точное значение цвета не только для каких-то элементов открытых в браузере, но и любых других элементов, отображающихся на вашем мониторе.
После того, ка вы выбрали тот цвет, который вам нравится, вы нажимаете сочетание клавиш CTRL+ALT+C, и значение этого цвета попадает в буфер обмена.
Затем, это значение можно также задать в качестве цвета фона, но при этом обращаю ваше внимание, что оно копируется без знака решетки.
Цвет определяется в шестнадцатеричном формате но знак решетки # вам нужно будет дописывать самостоятельно чтобы получилось примерно так: «#2F73B6».
Так же, плюс этой программы в том, что вы помимо того, что можете определять точное значение цвета, так же можно немного его изменять.
Например, я хочу для этой кнопки сделать эффект при наведении, чтобы фон становился более темный или более светлый, но при этом оттенок должен сохранялся. Для этого:
1.Сначала нажимаем CTRL+ALT+C, что бы скопировать значение цвета.
2.Затем, на клавиатуре, нажимаем CTRL+ALT+X, после чего открывается вот такая палитра:
3.В этой палитре можно либо выбирать интересующие оттенки, либо при помощи ползунка справа делать цвет более темным или более светлым. При этом в окне предпросмотра отображается оттенок, который получается в результате этих манипуляций. Здесь значение цвета отображается как в формате RGB, так и в шестнадцатеричном формате.
4.Если значение скопированного цвета не вставилось автоматически, то нужно вставить его в поле «HTML», а уже потом делать его темнее или светлее при помощи ползунка справа.
5.После выбора нужного оттенка копируем шестнадцатеричное значение цвета из поля “HTML”
Для смены цвета фона при наведении нужно приписать к классу или идентификатору элемента псевдокласс hover, а заем задать цвет фона.
Я обычно при верстке или доработке сайтов использую именно эту программку.
Вы можете скачать данную программу к себе на компьютер, нажав на ссылку ниже.
Видеоинструкция
На этом у меня все. Если данная статья была для вас полезна – не забудьте оставить комментарий и подписаться на мою рассылку. Спасибо за то, что посетили мой сайт и до встречи в следующей статье!
С уважением Юлия Гусарь
impuls-web.ru
Как узнать цвет пикселя на экране монитора или картинке
Такой вопрос наверняка ни раз возникал у веб-дизайнера, разработчика или простого пользователя компьютера. Часто возникает необходимость подобрать цвет используемый на каком-либо объекте, например сайте или просто точки на экране монитора.
Такой вопрос наверняка ни раз возникал у веб-дизайнера, разработчика или простого пользователя компьютера. Часто возникает необходимость подобрать цвет используемый на каком-либо объекте, например сайте или просто точки на экране монитора.
Существуют несколько основных способов представления цветов, например когда каждый цвет или оттенок, обозначается HTML кодом и цветовой палитрой RGB в виде #FF7700. Это представление в виде трёх пар шестнадцатеричных цифр, в которых каждая пара отвечает за свой цвет:
первые две цифры — красный цвет, т.е. — R (red)
две в середине — зелёный — G (green)
последние две цифры — синий — B (blue)
Довольно часто используют крадкое представление цвета в виде трех символов #F70, что будет равносильно #FF7700.
Кстати, на веб-ресурсах цвета обычно указываются в стилях CSS.
Давайте перейдем к ответу на главный вопрос — Как узнать цвет пикселя на экране монитора или картинке?
Способов большое множество...
Способ 1. Узнаем цвет в photoshop
Итак, сделаем "снимок экрана" нажатием на клавиатуре клавиши — Print Screen (PrtSc), в том месте, где хотим узнать код нашего цвета. Во время нажатия клавиши система сохранит снимок в буфере обмена. Можно просто скопировать изображение, например из браузера, без PrtSc. Теперь остается только вставить изображение из буфера в фотошоп.
Открываем фотошоп и вставляем изображение (Файл — Создать, Редактирование — Вставить). Ищем на панели инструментов "Пипетка" (Клавиша I), далее щелкаем левой кнопкой мыши в ту область, в котрой хотим "снять" цвет. Все готово! Теперь остается перейти в палитру и узнать код цвета.
Способ 2. Узнаем цвет в Paint
Заходим в Paint — вставляем картинку — используем инструмент "палитра" — переходим в "изменение цветов":
В нашем случае красный — 252, зеленый — 168, синий — 10, т.е. RGB(252,168,10) или в HEX формате #FCA80A.
Способ 3. Просмотреть код элемента в браузере
Опишу способ для браузера Opera. Выделяем мышкой элемент на сайте и щелкаем по нему правой кнопкой мыши — "Просмотреть код элемента" (Ctrl + Shift + C). Откроется панель с html и css кодом, нужно будет найти что-то подобное "color".
Способ 4. Использование специальных средств или программ.
Существует большое количество специальных программ для снятия цвета, мне нравится очень простая прога под названием "Pixie" с весом около 10-11 Кб. Управление очень простое. Достаточно просто навести мышь в нужную точку на экране монитора и нажать следующие клавиши — Ctrl + Alt + C, в результате чего цветовой код скопируется в буфер обмена.
amur.pro
HTML цвета
Подробную информацию об использовании цветов в HTML и CSS, способах указания цвета с помощью шестнадцатеричных значений, значений цвета RGB, RGBA, HSL, HSLA и с помощью предопределённых цветов, вы сможете найти в следующих статьях учебников:
Конвертер цветов
Конвертер цветов позволяет преобразовать (конвертировать) RGB цвета (аббревиатура английских слов red, green, blue — красный, зелёный, синий) в шестнадцатеричные (HEX) значения, RGB цвета в формат HSL (от англ. hue, saturation, lightness (intensity) - тон, насыщенность и осветленность) и обратно HEX значения в RGB и HSL цвета.
Предопределенные имена цветов
Красные
Имя цвета
HEX
RGB
IndianRed
#CD5C5C
rgb(205, 92, 92)
LightCoral
#F08080
rgb(240, 128, 128)
Salmon
#FA8072
rgb(250, 128, 114)
DarkSalmon
#E9967A
rgb(233, 150, 122)
LightSalmon
#FFA07A
rgb(255, 160, 122)
Crimson
#DC143C
rgb(220, 20, 60)
Red
#FF0000
rgb(255, 0, 0)
FireBrick
#B22222
rgb(178, 34, 34)
DarkRed
#8B0000
rgb(139, 0, 0)
Жёлтые
Имя цвета
HEX
RGB
Gold
#FFD700
rgb(255, 215, 0)
Yellow
#FFFF00
rgb(255, 255, 0)
LightYellow
#FFFFE0
rgb(255, 255, 224)
LemonChiffon
#FFFACD
rgb(255, 250, 205)
LightGoldenrodYellow
#FAFAD2
rgb(250, 250, 210)
PapayaWhip
#FFEFD5
rgb(255, 239, 213)
Moccasin
#FFE4B5
rgb(255, 228, 181)
PeachPuff
#FFDAB9
rgb(255, 218, 185)
PaleGoldenrod
#EEE8AA
rgb(238, 232, 170)
Khaki
#F0E68C
rgb(240, 230, 140)
DarkKhaki
#BDB76B
rgb(189, 183, 107)
Оранжевые
Имя цвета
HEX
RGB
Coral
#FF7F50
rgb(255, 127, 80)
Tomato
#FF6347
rgb(255, 99, 71)
OrangeRed
#FF4500
rgb(255, 69, 0)
DarkOrange
#FF8C00
rgb(255, 140, 0)
Orange
#FFA500
rgb(255, 165, 0)
Розовые
Имя цвета
HEX
RGB
Pink
#FFC0CB
rgb(255, 192, 203)
LightPink
#FFB6C1
rgb(255, 182, 193)
HotPink
#FF69B4
rgb(255, 105, 180)
DeepPink
#FF1493
rgb(255, 20, 147)
MediumVioletRed
#C71585
rgb(199, 21, 133)
PaleVioletRed
#DB7093
rgb(219, 112, 147)
Фиолетовые
Имя цвета
HEX
RGB
Lavender
#E6E6FA
rgb(230, 230, 250)
Thistle
#D8BFD8
rgb(216, 191, 216)
Plum
#DDA0DD
rgb(221, 160, 221)
Violet
#EE82EE
rgb(238, 130, 238)
Orchid
#DA70D6
rgb(218, 112, 214)
Fuchsia(Magenta)
#FF00FF
rgb(255, 0, 255)
MediumOrchid
#BA55D3
rgb(186, 85, 211)
MediumPurple
#9370DB
rgb(147, 112, 219)
BlueViolet
#8A2BE2
rgb(138, 43, 226)
DarkViolet
#9400D3
rgb(148, 0, 211)
DarkOrchid
#9932CC
rgb(153, 50, 204)
DarkMagenta
#8B008B
rgb(139, 0, 139)
Purple
#800080
rgb(128, 0, 128)
Indigo
#4B0082
rgb(75, 0, 130)
SlateBlue
#6A5ACD
rgb(106, 90, 205)
DarkSlateBlue
#483D8B
rgb(72, 61, 139)
Коричневые
Имя цвета
HEX
RGB
Cornsilk
#FFF8DC
rgb(255, 248, 220)
BlanchedAlmond
#FFEBCD
rgb(255, 235, 205)
Bisque
#FFE4C4
rgb(255, 228, 196)
NavajoWhite
#FFDEAD
rgb(255, 222, 173)
Wheat
#F5DEB3
rgb(245, 222, 179)
BurlyWood
#DEB887
rgb(222, 184, 135)
Tan
#D2B48C
rgb(210, 180, 140)
RosyBrown
#BC8F8F
rgb(188, 143, 143)
SandyBrown
#F4A460
rgb(244, 164, 96)
Goldenrod
#DAA520
rgb(218, 165, 32)
DarkGoldenrod
#B8860B
rgb(184, 134, 11)
Peru
#CD853F
rgb(205, 133, 63)
Chocolate
#D2691E
rgb(210, 105, 30)
SaddleBrown
#8B4513
rgb(139, 69, 19)
Sienna
#A0522D
rgb(160, 82, 45)
Brown
#A52A2A
rgb(165, 42, 42)
Maroon
#800000
rgb(128, 0, 0)
Синие
Имя цвета
HEX
RGB
Aqua(Cyan)
#00FFFF
rgb(0, 255, 255)
LightCyan
#E0FFFF
rgb(224, 255, 255)
PaleTurquoise
#AFEEEE
rgb(175, 238, 238)
Aquamarine
#7FFFD4
rgb(127, 255, 212)
Turquoise
#40E0D0
rgb(64, 224, 208)
MediumTurquoise
#48D1CC
rgb(72, 209, 204)
DarkTurquoise
#00CED1
rgb(0, 206, 209)
CadetBlue
#5F9EA0
rgb(95, 158, 160)
SteelBlue
#4682B4
rgb(70, 130, 180)
LightSteelBlue
#B0C4DE
rgb(176, 196, 222)
PowderBlue
#B0E0E6
rgb(176, 224, 230)
LightBlue
#ADD8E6
rgb(173, 216, 230)
SkyBlue
#87CEEB
rgb(135, 206, 235)
LightSkyBlue
#87CEFA
rgb(135, 206, 250)
DeepSkyBlue
#00BFFF
rgb(0, 191, 255)
DodgerBlue
#1E90FF
rgb(30, 144, 255)
CornflowerBlue
#6495ED
rgb(100, 149, 237)
MediumSlateBlue
#7B68EE
rgb(123, 104, 238)
RoyalBlue
#4169E1
rgb(65, 105, 225)
Blue
#0000FF
rgb(0, 0, 255)
MediumBlue
#0000CD
rgb(0, 0, 205)
DarkBlue
#00008B
rgb(0, 0, 139)
Navy
#000080
rgb(0, 0, 128)
MidnightBlue
#191970
rgb(25, 25, 112)
Имя цвета
HEX
RGB
Зелёные
GreenYellow
#ADFF2F
rgb(173, 255, 47)
Chartreuse
#7FFF00
rgb(127, 255, 0)
LawnGreen
#7CFC00
rgb(124, 252, 0)
Lime
#00FF00
rgb(0, 255, 0)
LimeGreen
#32CD32
rgb(50, 205, 50)
PaleGreen
#98FB98
rgb(152, 251, 152)
LightGreen
#90EE90
rgb(144, 238, 144)
MediumSpringGreen
#00FA9A
rgb(0, 250, 154)
SpringGreen
#00FF7F
rgb(0, 255, 127)
MediumSeaGreen
#3CB371
rgb(60, 179, 113)
SeaGreen
#2E8B57
rgb(46, 139, 87)
ForestGreen
#228B22
rgb(34, 139, 34)
Green
#008000
rgb(0, 128, 0)
DarkGreen
#006400
rgb(0, 100, 0)
YellowGreen
#9ACD32
rgb(154, 205, 50)
OliveDrab
#6B8E23
rgb(107, 142, 35)
Olive
#808000
rgb(128, 128, 0)
DarkOliveGreen
#556B2F
rgb(85, 107, 47)
MediumAquamarine
#66CDAA
rgb(102, 205, 170)
DarkSeaGreen
#8FBC8F
rgb(143, 188, 143)
LightSeaGreen
#20B2AA
rgb(32, 178, 170)
DarkCyan
#008B8B
rgb(0, 139, 139)
Teal
#008080
rgb(0, 128, 128)
Белые
Имя цвета
HEX
RGB
White
#FFFFFF
rgb(255, 255, 255)
Snow
#FFFAFA
rgb(255, 250, 250)
Honeydew
#F0FFF0
rgb(240, 255, 240)
MintCream
#F5FFFA
rgb(245, 255, 250)
Azure
#F0FFFF
rgb(240, 255, 255)
AliceBlue
#F0F8FF
rgb(240, 248, 255)
GhostWhite
#F8F8FF
rgb(248, 248, 255)
WhiteSmoke
#F5F5F5
rgb(245, 245, 245)
Seashell
#FFF5EE
rgb(255, 245, 238)
Beige
#F5F5DC
rgb(245, 245, 220)
OldLace
#FDF5E6
rgb(253, 245, 230)
FloralWhite
#FFFAF0
rgb(255, 250, 240)
Ivory
#FFFFF0
rgb(255, 255, 240)
AntiqueWhite
#FAEBD7
rgb(250, 235, 215)
Linen
#FAF0E6
rgb(250, 240, 230)
LavenderBlush
#FFF0F5
rgb(255, 240, 245)
MistyRose
#FFE4E1
rgb(255, 228, 225)
Серые
Имя цвета
HEX
RGB
Gainsboro
#DCDCDC
(220, 220, 220)
LightGray
#D3D3D3
rgb(211, 211, 211)
Silver
#C0C0C0
rgb(192, 192, 192)
DarkGray
#A9A9A9
rgb(169, 169, 169)
Gray
#808080
rgb(128, 128, 128)
DimGray
#696969
rgb(105, 105, 105)
LightSlateGray
#778899
rgb(119, 136, 153)
SlateGray
#708090
rgb(112, 128, 144)
DarkSlateGray
#2F4F4F
rgb(47, 79, 79)
Black
#000000
rgb(0, 0, 0)
basicweb.ru
Как узнать код краски по VIN коду автомобиля
Серебристо-черный
Голубой
Белая двухслойная
Серебристый сине-зеленый
Темно-серо-бежевый
Серебристый фиолетовый
Темно-зеленый
Серебристо-бежевый
Синий
Серебристый зелено-голубой
Фиолетовый
Сине-зеленый
Зеленый
Бежевый
Серо-бежевый
Белый
Ярко-белый
Серо-белый
Зелено-голубой
Серо-фиолетовый
Серо-зеленый металлик
Серебристый ярко-красный
Вишневый
Темно-красный
Светло-зелено-голубой
Голубой
Темно-бордовый
Золотисто-красно-коричневый
Бело-желтый
Ярко-желтый
Молочно-бело-серебристый
Зеленый
Зеленый
Золотой
Золотистый темно-зеленый
Серебристый ярко-зеленый
Серебристо-зеленый
Фиолетовый
Красный металлик
Сине-зеленый
Ярко-красный
Красный
Средний серо-зеленый
Темно-зеленый
Серебристый темно-красный
Серебристый темно-зеленый
Коричневый
Серебристо-желтый
Серебристо-ярко-синий
Серо-бежевый
Серебристо-синий
Фиолетово-синий металлик
Серебристый темно-синий
Серебристый темный
Серебристый темно-бордовый
Голубой
Бежево-розовый
Серебристый желто-зеленый
Графитовый металлик
Серо-бежевый металлик
Ярко-синий
Зеленый металлик
Ярко-фиолетовый
Сине-зеленый
Желтый
Темный серо-синий металлик
Серебристо-бежевый
Золотисто-серый
Темно-голубой
Желто-зеленый
Золотисто-зеленый
Серебристо-голубой
Серебристый серо-оранжевый
Серебристый серо-зеленый
Серебристый серо-зеленый
Красно-оранжевый
Серо-синий
Красно-коричневый
Зелено-синий
Фиолетово-черный
Серебристо-бежевый
Светло-желтый
Серебристый ярко-синий
Серебристый темно-синий
Вишневый
Красный
Бежево-красный металлик
Серебристый сине-фиолетовый
Светло-бежевый
Светло-серый
Серебристый
Светло-зеленый
Серо-голубой
Серо-зеленый
Синий
Сливочно-белый
Светло-серебристый металл
Ярко-белый
Серо-сине-зеленый
Серебристый коричнево-зеленый
Темно-бежевый
Темно-бежевый
Темно-коричневый
Красный
Серебристо-красный
Серебристо-синий
Голубой металлик
Темно-зеленый
Светло-желтый
Серебристый Темно-фиолетовый
Черный
Темно-серый металлик
Серо-голубой
www.driver-helper.ru
Определить цвет пикселя онлайн
При работе с графическими файлами в компьютере нам часто необходимо узнать какой-нибудь оттенок в одной из цветовых моделей. Это нужно для того, чтобы использовать этот цвет в своей разработке. Графические программы имеют специальный для этой задачи инструмент «Пипетка». Но его действие обычно распространяются только на рабочее окно. За его пределами функция не работает. Из этой статьи вы узнаете, как можно определить цвет пикселя в режиме онлайн.
Sanstv.ru — простой и доступный инструмент для определения цвета пикселя
Многие дизайнеры, блогеры, художники знают, что веб-цвета имеют цифровое представление. Самой популярной моделью является RGB (красный, зеленый, синий). Эти три цвета при смешивании становятся основой для других оттенков. Поэкспериментировать с ними можно на сайте https://sanstv.ru/. На главной странице вы увидите разноцветный круг и выше параметры колора, представленные в модели RGB. Попробуйте сами передвигать ползунки каждого из трех цветов и увидите, как меняется расцветка пикселя в блоке выше.
Сервис для определения цвета пикселя
Это еще и отличный инструмент, который поможет вам выбрать любой элемент в браузере. Открыв главное окно сайта, вы можете перетащить в него нужную фотографию и узнать цвет любого пикселя на нём. Вы можете нажать кнопку «Обзор» и выбрать его на своем жестком диске, если вам так удобнее. Изображение не обязательно должно быть загружено с вашего ПК. Вы можете открыть какой-нибудь сайт или картинку в интернете и сделать её скриншот. Просто нажмите клавишу PrintSc.
Дальнейший порядок действий:
Вернитесь обратно на вкладку Sanstv.ru;
Нажмите уже в этом окне Ctrl+V;
Рабочее окно сайта Senstv.ru
Когда изображение вставится в рабочее окно, курсор мыши примет вид крестика, которым вы можете определить пиксель любой части скриншота. Для этого нужно просто нажать на него.
После нажатия на нужный цвет, он отобразится вверху. Рядом с цветовым блоком вы увидите значение цвета в RGB и HEX. Если вы хотите выбрать какой-нибудь очень маленький элемент скриншота, нажмите на клавиатуре клавишу Ctrl и прокрутите колесико мыши в нужном направлении. Этим способом можно увеличивать или уменьшать весь скриншот или загруженную фотографию.
Eye Dropper — расширение для идентификации цифрового колора
Возможно, еще кто-нибудь не знает, но расширения в браузере являются дополнительными инструментами. Они доступны в специальных магазинах. Так как Google Chrome является одним из популярных программ для серфинга в интернете, в его магазине больше всего таких мини-программ. Но нам не нужны все, а только Eye Dropper. Магазин Chrome находится на странице https://chrome.google.com/webstore/category/extensions?hl=ru. Чтобы найти расширение, выберите слева вверху строку поиска и введите в ней название.
Поиск Eye Dropper в магазине расширений Chrome
Это расширение является своеобразной пипеткой для браузера. При этом она будет работать повсеместно и выбирать для вас любой пиксель. После чего предоставлять всю нужную информацию по цвету. Это очень удобно, и к тому же не нужно ничего копировать или вставлять. Когда вы найдете расширение, выберите напротив него кнопку «Установить». Вверху на панели браузера Chrome появится маленькое изображение пипетки. Чтобы начать с ней работать нажмите на неё.
Дальнейший порядок действий:
Откроется контекстное меню, где для выбора оттенка в браузере нужно нажать кнопку «Pick color from web-page»;
Расширение Google Chrome Eye Dropper
Указателем выберите нужный участок на экране, он тут же копируется. А цветовой квадратик возле пипетки примет оттенок, который вы выбрали;
Слева в информационном блоке расширения будут числовые значение в RGB, HSL, HTML и др. Чтобы удалить текущий колор, нажмите корзинку под кнопкой выбора;
Инструменты Eye Dropper
Вы можете загрузить данные цвета в формате CSV, который можно открыть программой MS Excel.
При этом небольшое расширение Eye Dropper позволяет автоматически копировать данные выбранного цвета на мониторе. Есть настройка горячих клавиш для быстрого запуска в браузере, а также история всех выбранных раннее вариантов. Если вы пользуетесь браузером Google Chrome и вам часто необходимо определять цвета разных пикселей online, то это расширение несомненно для вас.
Есть еще несколько других инструментов в интернете. Возможно, они не такие удобные, как те, что были уже рассмотрены. Но некоторым они тоже могут понравится. Inettools — это еще одна онлайн-пипетка. Здесь вам также потребуется загрузить изображение, откуда нужно выбрать цвет цифровой картинки. Попадая на главную страницу https://ru.inettools.net, вы увидите рабочее окно. В него можно перетащить изображение. А можно загрузить его, нажав на кнопку под окном «Выбрать». После этого указать на своем компьютере путь к изображению.
Дальнейшие действия:
Когда картинка будет на рабочем столе Inettools, просто выберите курсором мыши любую точку на картинке;
Рабочее окно Inettools
Вся информация по выбранному пикселю отобразится в блоке ниже под названием «Сохраненное значение». Здесь представлен этот цвет в RGB и HTML, а также указано положение по горизонтали и вертикали;
В блоке «Текущее положение» отображается значение курсора, которым вы передвигаете в настоящее время.
Определение цвета пикселя в Inettools
С помощью такого нехитрого инструмента очень просто узнать любой цветовой пиксель на фотографии или цветной картинке. В нем можно выбирать несколько изображений и переключаться между ними. Их список находится под рабочим столом. Онлайн-инструментом подобного типа является https://imagecolorpicker.com/ru. В отличие от предыдущего сервиса, здесь есть возможно только загружать картинки из своего компьютера или по указанному URL.
Pixie — простая утилита для распознавания оттенка на экране
Небольшая утилита Pixie является портативной. Это значит, что после её загрузки на свой компьютер вам не придется её устанавливать. Размер её весьма мал — 11 килобайт. Вы можете упрятать её куда-нибудь подальше в папку, чтобы она не мешала. А на рабочий стол вывести иконку. Таким образом вы получите удобный и простой инструмент, который способ определять цвет на экране не зависимо от того, какая программ сейчас работает. Это может быть браузер или даже игра.
Запустив утилиту Pixie, нужно навести курсор на часть экрана, и вы тут же определить цвет в шести различных цветовых моделях: RGB, HEX, CMYK, HSV, pixel at, HTML. Информация отображается в небольшом окошке. Вы сможете загрузить утилиту Pixie с сайта разработчика — http://www.nattyware.com/pixie.php. Она абсолютно бесплатна и будет работать во всех версиях ОС Windows.
Другие инструменты, которые помогут определить цвет пикселя
Есть еще одна утилита с похожими функциями — HTML-Color 2000. Эта программа ограничена только цветовой схемой HTML и RGB. И отображает информацию только соответственно этим цветовым представлениям. Загрузить её можно по ссылке https://siteblogger.ru/programs/programma-html-colors-2000.html. Чтобы узнать цвет в HTML, нужно в окне программы нажать на кнопку «Screen». После этого она отображает необходимую информацию соответственно в двух блоках. Колор в ней можно изменять самому. Например, чтобы узнать код HTML-цвета, выберите его название из списка в блоке программы.
Программа HTMLColor 2000
Также не стоит забывать, что оттенки умеют определять большинство графических редакторов. Но в некоторых, таких как стандартный Paint в Windows, не отображается информация о графической модели. Мы рассмотрели достаточно инструментов для определения цвета пикселя в режиме онлайн. Теперь вы сможете выбрать самый подходящий для своих задач.
it-doc.info
Как узнать цвет элемента на сайте или экране монитора
Необходимость точного определения цвета элемента в цифровом представлении возникает, например, при оформлении внешнего вида сайта или блога, при желании использовать понравившийся цвет с чужого блога на своем сайте, при подборе картинок для статей и т.д.
Некоторые программы позволяют назначать пользовательские цвета для элементов интерфейса. Мне, например, не нравятся цвета, используемые в известном файловом менеджере Total Commander при первом запуске его на компьютере, и я установил их такими, как показано ниже
Рис. 1
Сначала коротко о методах представления цветов. В web документах обычно используются следующие способы – текстовое обозначение, палитра RGB и шестнадцатеричный код (рис. 2).
Рис. 2. Набор из 16 стандартных цветов
Кодировка RGB отличается от шестнадцатеричной тем, что в первом случае используется десятичная система исчисления, а во втором – шестнадцатеричная, например, 247=15×16+7=#f7, 192=12×16+0=#С0. Такое преобразование делаем для каждого из трех десятичных чисел, характеризующих интенсивности красного, зеленого и синего цветов в палитре RGB (RGB(138,43,226)=#8A2BE2, т.к. 8A=8×16+10=138, 2B=2×16+11=43, E2=14×16+2=226).
Когда я только начинал работать в интернете и мне нужно было подобрать цвет по имеющемуся образцу, я это делал «на глаз» по палитре цветов. Определить точное цифровое представление имеющегося цвета таким способом практически невозможно. Существует несколько способов решения этой проблемы. Для Google Chrome имеется расширение Eye Dropper, которое можно установить по ссылке
(скопируйте и вставьте в строку браузера). После установки в панели с кнопками расширений появляется значок с пипеткой (рис. 3)
Рис. 3
Нажимаем на этот значок, откроется окно,
Рис. 4
содержащее историю предыдущих проб определения цвета (слева снизу) и их результат (справа). Для выполнения новой пробы жмем на кнопку с каплей (слева сверху),
Рис.5
появится курсор с небольшим квадратиком рядом с ним, окрашенным в цвет точки, на которую указывает курсор (рис. 5). В нижней части экрана с правой стороны отобразится черный прямоугольник с цифровым кодом этого цвета. Если нажать на левую кнопку мыши, то результат измерения отобразится в окне, показанном на рис. 4.
При выборе вкладки «Color picker» (рис. 4 сверху) откроется окно, в котором можно выбрать цвет по цветовой палитре и при желании добавить его в историю измерений.
Рис. 6
Похожими возможностями обладает расширение ColorZilla, имеющееся в браузерах Google Chrome и Mozilla Firefox.
Если нужно определить цвет любого элемента, отображенного на экране монитора, то можно воспользоваться небольшой программой Pixie Portable, ярлык которой я поместил на панель быстрого запуска программ. Работа этой программы показана на рис. 7
Рис. 7
При запуске программы в центре экрана отображается окно, в котором показан цвет точки, расположенной под курсором, и цифровые коды этого цвета в различных системах. Если курсор расположить внутри этого окна, то в нем отобразятся горячие клавиши программы:
Рис.8
Ctrl+Alt+C – копирование в буфер обмена HTML кода.
Ctrl+Alt+X – открытие окна палитры цветов.
Ctrl+Alt+Z – увеличение области под курсором для более точного определения цвета мелких элементов.
С помощью кнопок » x » и » _ » окно можно закрыть или свернуть в системный трей.
В заключение приведем HTML коды, так называемых, web-безопасных цветов, одинаково отображающихся во всех браузерах (216 кодов).
Web-safe colors
Хорошего Вам настроения.
С уважением, Александр Резунов.
sopromat.pro
Как определить HTML код цвета на экране
Такой вопрос может возникнуть у веб-дизайнера или разработчика, когда нужно определить какой цвет используется на каком-либо объекте, например сайте или просто точки на экране.
Каждый цвет или оттенок который мы видим на экране, обозначается HTML кодом и RGB палитрой цветов, для сайтов цвета и стили обычно указывают в таблице CSS. RGB – это аббревиатура, состоящия из первых английских букв названия цветов, красного, зеленого и синего. Распределение этих трех цветов достаточно чтобы дать нам любой нужный цвет.
Теперь, переходим к ответу на главный вопрос, как узнать код цвета на экране?
Чтобы узнать код цвета на любой точке экрана, неважно при этом открыт ли у вас сайты в браузере или просто пустой рабочий стол, можно идентифицировать цвет всего что угодно что отображается на мониторе.
Для этого нам понадобиться малюсенькая но полезная программа — Instant Eyedropper. Вот – прямая ссылка на скачивание. Установка и запуск займут меньше минуты. После запуска в правом нижнем углу появиться круглая иконка:
Мы кликаем на нее левой кнопкой мыши и всплывает окошко, кнопку мыши не отпускайте, переносите курсор в нужную область экрана и смотрите какой код отображается, пример :
На примере код в виде #ffffff.Кроме этого, есть еще настройки вывода кода в разных форматах(HEX, HTML, RGB другие) Можно поставить галочку на нужный формат, кликните по тому же значку но теперь правой кнопкой мыши:
Данную программу можно использовать вместе в фотошопом, в дополнение. У вас остались еще вопросы или все ОК?
Алексей Повловский
web-profy.com
Определение цвета при помощи color online picker
Здравствуйте, дорогие друзья!
Наверняка вы уже сталкивались с проблемой определения и подбора цвета. Давайте рассмотрим несколько сервисов color online picker, которые значительно упростят вам эту задачу и сэкономят время.
Навигация по статье:
materialui.co
Этот online сервис представляет собой палитру, кликая по которой вы выбираете цвет и при помощи ползунка справа подбираете нужный оттенок. Там же с правой стороны есть панель, на которой отображается выбранный образец цвета и его значения в разных форматах.
w3schools.com
Данный online color picker позволяет не просто выбрать цвет из палитры, а ещё и раскладывает его по оттенкам и показывает значение цвета для каждого из них. Так же вы можете ввести своё значение, чтобы сервис подобрал оттенки к нему.
Если этого покажется вам не достаточно, то вы можете поиграть с балансом красного, зелёного и синего чтобы получить нужный вам цвет.
Так же этот online сервис обладает инструментами по побору сочетаний цветов, конвертации, определению значений, различными цветовыми схемами и так далее.
На панели слева вы можете выбирать интересующий вас инструмент.
htmlcolorcodes.com
Сервис позволяет не просто определить или подобрать цвет и отображает разные форматы его задания, но и показывает наиболее подходящие цвета используя разные алгоритмы подбора.
Под палитрой отображаются схемы подбора сочетающихся цветов.
Так же этот online сервис позволяет экспортировать подобранные цвета в разных форматах и с нужными атрибутами HTML и CSS свойствами. Благодаря этому вы можете сразу скопировать строку соответствующую порядковому номеру нужного цвета в блоке HTML, например, и вставить этот код в один из тегов для которого нужно изменить цвет текста. Как по мне, то это очень удобно!
Для создания своей палитры для экспорта вам нужно сначала двойным щелчком мышки кликнуть по прямоугольнику с понравившимся цветом, после чего он сразу попадёт в палитру с выбранными цветами сверху. Таким образом, вы можете выбрать до 6 цветов, а затем нажать на кнопку экспорта рядом с этой палитрой.
Так же можно выбирать алгоритм подбора цветов при помощи выпадающего списка сразу под палитрой и экспортировать подобранную сервисом палитру.
Лично мне этот online color picker очень понравился, так как он объединяет в себе практически все инструменты для работы с определением цветов. Единственное что я бы в нём добавила, так это возможность загрузки изображения и определение цветов на нём.
Определение цвета изображения при помощи pinetools.com
Здесь можно выполнить загрузку изображения, нажав на кнопку «Обзор» и определить цвет отдельных его частей при помощи color picker. Так же на панели инструментов есть кнопки для увеличения и уменьшения изображения.
Сервис html-color-codes.info для определение цвета изображения
Как и на предыдущем online сервисе здесь вы можете выполнить загрузку картинки и определить цвет её элементов.
Так же можно вставить ссылку на изображение и нажать на кнопку «GO» для его загрузки.
Далее в левой части вы увидите загруженное изображение, по которому нужно кликнуть, а затем водя по нему мышкой, в верхнем правом прямоугольнике будет отображаться увеличенный фрагмент этого изображения. Выбрав нужный цвет, кликаете по нему и в прямоугольнике снизу отображается его образец, а ниже значение.
Думаю, что этих 5 online сервисов вам хватит на все случаи жизни! Если вы знаете ещё какие то полезные сервисы color picker – пишите о них в комментариях. Лично мне больше всего понравился htmlcolorcodes.com и html-color-codes.info, а вам?
Успехов вам и вашим проектам!
С уважением Юлия Гусарь
impuls-web.ru
Определение цвета на экране монитора с помощью программ
Очень часто во время работы с сайтами и картинками требуется определить цветкакой-либо точки Вашего экрана монитора.
Например, Вы хотите сделать цвет фона на сайте точно таким же, как цвет голубого неба на фотографии. Или шрифт заголовков сделать такой, как цвет морской волны. Или наоборот, цвет шрифта использовать как фон для создания баннера. Словом, вариантов много. Тщательный подбор цветов очень много значит как в вебдизайне, так и в работе вебмастера.
Определение цвета означает нахождение его кода. Затем код, в зависимости от Ваших целей, можно использовать как в различных графических редакторах, так и непосредственно в коде html.
Чаще всего при этом используется режим RGB, в котором код можно представить в десятичной и шестнадцатиричной системе.
Очень удобно для определения цвета использовать пипетку программы FSCapture. Но, кроме этой программы, есть и другие, с помощью которых можно это делать.
Пипетка программы Adobe Photoshop
Думаю, немногие пользователи этой программы знают, что с помощью нее можно определить цвет не только любой точки на картинке, открытой в редакторе, но и любой точки на экране Вашего монитора.
Делается это очень просто. Открываете программу Adobe Photoshop, создаете в ней изображение, и, не отпуская левую клавишу мыши, переводите курсор пипетки туда, где находится выбранная Вами точка. Это может быть любая точка за пределами окна программы. По мере движения курсора Вы будете видеть, как изменяется цвет рисования на палитре цветов. После выбора нужной точки отпускаете клавишу мыши. Кликаете по окошку цвета рисования на палитре цветов, и смотрите код Вашего цвета.
Такой способ определения цвета удобен тем, что не требует установки никаких дополнительных программ, кроме фотошопа, который у большинства пользователей и так уже установлен.
Теперь не нужно делать скриншоты, и открывать их в фотошопе, чтобы определить цвет нужного Вам пикселя, все можно сделать гораздо быстрее и проще.
Программа ColorPix
Если Вы не хотите каждый раз для определения цвета открывать программу Photoshop, можете воспользоваться гораздо более легкой программой, которая называется ColorPix. Скачать ее Вы можете по ссылке ниже:
Программа не требует установки, и очень маленькая — весит всего 400 Кб. Работать с ней легко — наводите мышкой на любую точку на экране, и смотрите коды в окошке. При необходимости можно воспользоваться лупой, нажав на ее изображение в нижней части окошка программы.
Чтобы закрепить полученный цвет, нажмите Enter. В окошке цвета появится изображение замочка. Чтобы снять закрепление, опять нажмите Enter.
Программа ColorMania
В отличие от программы ColorPix, ее нужно устанавливать. Но она гораздо более продвинутая: с помощью нее Вы можете определить код цвета любой точки на цветовом круге, отрегулировать цветовые характеристики выбранного цвета, или использовать пипетку.
Чтобы использовать пипетку, кликните по ее изображению в окне программы и, не отпуская клавишу мыши, перетащите на нужную точку экрана. В окне программы Вы при этом видите увеличенное изображение тех областей, где проходит курсор пипетки.
Можно кликнуть по цветовому кругу, или выбрать цвет из палитры. Также можно изменить выбранный цвет с помощью бегунков. Три верхних бегунка регулируют интенсивность красного, зеленого и синего цветов. Три нижних — тон, насыщенность и яркость. Эта опция программы пригодится, например. если Вы собираетесь использовать цвета одной тональности, но разных уровней насыщенности и яркости.
Словом, программа стоит того, чтобы ее скачать и использовать в работе.
Видеообзор программ для определения цвета на экране монитора
Более подробные сведения Вы можете получить в разделах "Все курсы" и "Полезности", в которые можно перейти через верхнее меню сайта. В этих разделах статьи сгруппированы по тематикам в блоки, содержащие максимально развернутую (насколько это было возможно) информацию по различным темам.
Также Вы можете подписаться на блог, и узнавать о всех новых статьях. Это не займет много времени. Просто нажмите на ссылку ниже: Подписаться на блог: Дорога к Бизнесу за Компьютером
Проголосуйте и поделитесь с друзьями анонсом статьи на Facebook: