Hypercrate UI

Lead Orange
#ff7951
Container Cream
#fff7ea
Signal Teal
#2cd4c3
Toggle Dust
#e0dbd2
Caption Bronze
#7f5f41
Text Darkbit
#121212

Палитра содержит светлый, полутемный, темный цвета. Акцентные цвета Container Cream #fff7ea да Signal Teal #2cd4c3. Палитра имеет цветовую температуру Теплый, Нейтральный, Холодный.

По светлоте палитра тянется от #121212 (самый тёмный) до #FFF7EA (самый светлый). Диапазон светлоты широкий.

Насыщенность смешанная — есть приглушённые цвета и более яркие акценты.

Некоторые пары оттенков близки к комплементарным позициям — возможно чтение как комплементарный контраст (эвристика).

В целом температура смещена в сторону тёплого.

HEX-коды (по возрастанию): #121212, #2CD4C3, #7F5F41, #E0DBD2, #FF7951, #FFF7EA

Палитра Hypercrate UI содержит комбинацию из 6 кодов цветов:

HEX: #ff7951, RGB: (255, 121, 81); HEX: #fff7ea, RGB: (255, 247, 234); HEX: #2cd4c3, RGB: (44, 212, 195)

HEX: #e0dbd2, RGB: (224, 219, 210); HEX: #7f5f41, RGB: (127, 95, 65); HEX: #121212, RGB: (18, 18, 18)

Упрощенная версия цветов палитры

Оттенок coral, Тень oldlace, Оттенок turquoise, Оттенок gainsboro, Тень sienna, Тень Черный

Цветовая схема создана автором bad_colors

Больше палитр с:

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

Hypercrate UI коды цветов HEX, RGB информация в таблице

Цвет	HEX	RGB	Название	Альтернативное название
#ff7951	#ff7951	RGB(255, 121, 81)	Lead Orange	—
#fff7ea	#fff7ea	RGB(255, 247, 234)	Container Cream	—
#2cd4c3	#2cd4c3	RGB(44, 212, 195)	Signal Teal	—
#e0dbd2	#e0dbd2	RGB(224, 219, 210)	Toggle Dust	—
#7f5f41	#7f5f41	RGB(127, 95, 65)	Caption Bronze	—
#121212	#121212	RGB(18, 18, 18)	Text Darkbit	Dark Tone Ink

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

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

Цвет текста	Цвет фона	Коэффициент контрастности
#ff7951	#2cd4c3	1.39
#ff7951	#e0dbd2	1.87
#fff7ea	#2cd4c3	1.74
#fff7ea	#e0dbd2	1.29
#2cd4c3	#e0dbd2	1.34

Изображение палитры Hypercrate UI png

--color-lead-orange:	#ff7951;
--color-container-cream:	#fff7ea;
--color-signal-teal:	#2cd4c3;
--color-toggle-dust:	#e0dbd2;
--color-caption-bronze:	#7f5f41;
--color-text-darkbit:	#121212;

$color-lead-orange:	#ff7951;
$color-container-cream:	#fff7ea;
$color-signal-teal:	#2cd4c3;
$color-toggle-dust:	#e0dbd2;
$color-caption-bronze:	#7f5f41;
$color-text-darkbit:	#121212;

@color-lead-orange:	#ff7951;
@color-container-cream:	#fff7ea;
@color-signal-teal:	#2cd4c3;
@color-toggle-dust:	#e0dbd2;
@color-caption-bronze:	#7f5f41;
@color-text-darkbit:	#121212;