Цвет Material Design Cyan 300: коды и конвертация

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

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

Маска: #E4002B

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

HEX

RGB

CMYK

HSL

HSV / HSB

LAB

HWB

OKLCH

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

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

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

Tailwind

teal-300
#5EEAD4
sky-400
#38BDF8
cyan-300
#67E8F9
cyan-400
#22D3EE
teal-400
#2DD4BF
blue-400
#60A5FA

Material

cyan-300
#4DD0E1
light-blue-300
#4FC3F7
cyan-400
#26C6DA
blue-300
#64B5F6
blue-400
#42A5F5
light-blue-400
#29B6F6

Web Safe

#66CCCC
#66CCCC
#33CCCC
#33CCCC
#66CCFF
#66CCFF
#33CCFF
#33CCFF
#66FFCC
#66FFCC
#33FFCC
#33FFCC

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

Семейство

Cyan

HEX

#4DD0E1

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

Цвет cyan-300 из Material Design подходит для сценариев, где важна предсказуемость и совместимость с готовыми компонентами. Средней насыщенности характер оттенка помогает понять, использовать ли его как фон, акцент или опорный цвет для иконок и action-элементов.

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

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

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

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

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

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

cyan-50 #E0F7FA cyan-100 #B2EBF2 cyan-200 #80DEEA cyan-400 #26C6DA cyan-500 #00BCD4 cyan-600 #00ACC1 cyan-700 #0097A7 cyan-800 #00838F