Цвет Material Design Blue Grey 700: коды и конвертация

На этой странице собраны точные коды цвета blue-grey-700 из Material Design. Конвертер предзаполнен HEX-значением, поэтому можно сразу смотреть RGB, CMYK, LAB, HWB и OKLCH для UI и полиграфии.

4.7 /5 (Оценок: 100)
Поддерживаются HEX, RGB, CMYK, HSL, HSV, LAB, HWB, OKLCH и CSS color names

Маска: #E4002B

Распознан формат: RGBНайдена палитра: blue-grey-700
Все форматы цвета

HEX

RGB

CMYK

HSL

HSV / HSB

LAB

HWB

OKLCH

Превью цвета
Откройте системную палитру и выберите оттенок без ручного ввода формата.
Текущее значение: #455A64
Выбранная плашка: blue-grey-700

Похожие цвета в палитрах

Ближайшие оттенки в Tailwind, Material и Web Safe относительно текущего цвета.

Tailwind

slate-600
#475569
gray-600
#4B5563
zinc-600
#52525B
neutral-600
#525252
stone-600
#57534E
slate-700
#334155

Material

blue-grey-700
#455A64
grey-700
#616161
blue-grey-800
#37474F
blue-grey-600
#546E7A
grey-800
#424242
brown-600
#6D4C41

Web Safe

#336666
#336666
#666666
#666666
#333366
#333366
#663366
#663366
#336633
#336633
#336699
#336699

Red

10
red-50
red-100
red-200
red-300
red-400
red-500
red-600
red-700
red-800
red-900

Pink

10
pink-50
pink-100
pink-200
pink-300
pink-400
pink-500
pink-600
pink-700
pink-800
pink-900

Purple

10
purple-50
purple-100
purple-200
purple-300
purple-400
purple-500
purple-600
purple-700
purple-800
purple-900

Deep Purple

10
deep-purple-50
deep-purple-100
deep-purple-200
deep-purple-300
deep-purple-400
deep-purple-500
deep-purple-600
deep-purple-700
deep-purple-800
deep-purple-900

Indigo

10
indigo-50
indigo-100
indigo-200
indigo-300
indigo-400
indigo-500
indigo-600
indigo-700
indigo-800
indigo-900

Blue

10
blue-50
blue-100
blue-200
blue-300
blue-400
blue-500
blue-600
blue-700
blue-800
blue-900

Light Blue

10
light-blue-50
light-blue-100
light-blue-200
light-blue-300
light-blue-400
light-blue-500
light-blue-600
light-blue-700
light-blue-800
light-blue-900

Cyan

10
cyan-50
cyan-100
cyan-200
cyan-300
cyan-400
cyan-500
cyan-600
cyan-700
cyan-800
cyan-900

Teal

10
teal-50
teal-100
teal-200
teal-300
teal-400
teal-500
teal-600
teal-700
teal-800
teal-900

Green

10
green-50
green-100
green-200
green-300
green-400
green-500
green-600
green-700
green-800
green-900

Light Green

10
light-green-50
light-green-100
light-green-200
light-green-300
light-green-400
light-green-500
light-green-600
light-green-700
light-green-800
light-green-900

Lime

10
lime-50
lime-100
lime-200
lime-300
lime-400
lime-500
lime-600
lime-700
lime-800
lime-900

Yellow

10
yellow-50
yellow-100
yellow-200
yellow-300
yellow-400
yellow-500
yellow-600
yellow-700
yellow-800
yellow-900

Amber

10
amber-50
amber-100
amber-200
amber-300
amber-400
amber-500
amber-600
amber-700
amber-800
amber-900

Orange

10
orange-50
orange-100
orange-200
orange-300
orange-400
orange-500
orange-600
orange-700
orange-800
orange-900

Deep Orange

10
deep-orange-50
deep-orange-100
deep-orange-200
deep-orange-300
deep-orange-400
deep-orange-500
deep-orange-600
deep-orange-700
deep-orange-800
deep-orange-900

Brown

10
brown-50
brown-100
brown-200
brown-300
brown-400
brown-500
brown-600
brown-700
brown-800
brown-900

Grey

10
grey-50
grey-100
grey-200
grey-300
grey-400
grey-500
grey-600
grey-700
grey-800
grey-900

Blue Grey

10
blue-grey-50
blue-grey-100
blue-grey-200
blue-grey-300
blue-grey-400
blue-grey-500
blue-grey-600
blue-grey-700
blue-grey-800
blue-grey-900

Система

material

Семейство

Blue Grey

HEX

#455A64

Как использовать этот цвет в проекте

Цвет blue-grey-700 из Material Design подходит для сценариев, где важна предсказуемость и совместимость с готовыми компонентами. Глубокий характер оттенка помогает понять, использовать ли его как фон, акцент или опорный цвет для иконок и action-элементов.

Как сочетать цвет в интерфейсе

При работе с Material-палитрой важно не брать оттенок изолированно: смотрите соседние ступени Blue Grey и оценивайте, как #455A64 выглядит на белом, сером и тёмном фоне. Такой подход помогает быстро собрать последовательную шкалу для состояний default, hover, pressed и disabled.

Что проверить перед экспортом

Практический сценарий простой: дизайнер фиксирует цвет blue-grey-700 в макете, а разработчик тут же получает HEX, RGB, HSL и OKLCH для CSS-переменных или токенов. Если нужен офлайн-носитель, проверка CMYK и LAB заранее снижает риск расхождения между экраном и печатью.

Похожие оттенки этой палитры

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

blue-grey-50 #ECEFF1 blue-grey-100 #CFD8DC blue-grey-200 #B0BEC5 blue-grey-300 #90A4AE blue-grey-400 #78909C blue-grey-500 #607D8B blue-grey-600 #546E7A blue-grey-800 #37474F