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

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

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

Маска: #E4002B

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

HEX

RGB

CMYK

HSL

HSV / HSB

LAB

HWB

OKLCH

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

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

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

Tailwind

emerald-200
#A7F3D0
slate-300
#CBD5E1
green-200
#BBF7D0
gray-300
#D1D5DB
teal-200
#99F6E4
sky-200
#BAE6FD

Material

teal-100
#B2DFDB
cyan-100
#B2EBF2
green-100
#C8E6C9
blue-grey-100
#CFD8DC
indigo-100
#C5CAE9
blue-100
#BBDEFB

Web Safe

#99CCCC
#99CCCC
#CCCCCC
#CCCCCC
#99FFCC
#99FFCC
#CCFFCC
#CCFFCC
#99CCFF
#99CCFF
#CCCCFF
#CCCCFF

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

Семейство

Teal

HEX

#B2DFDB

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

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

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

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

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

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

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

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

teal-50 #E0F2F1 teal-200 #80CBC4 teal-300 #4DB6AC teal-400 #26A69A teal-500 #009688 teal-600 #00897B teal-700 #00796B teal-800 #00695C