Dark Matter UI Component Pack

Matter Base Black
#090909
Glow Node Cyan
#00f5d4
Panel Dust Grey
#c4c4c4
Vector Path Pink
#ffa69e
Hover State White
#f8f8f8
Data Stripe Violet
#9d4edd

Палітра містить темний, світлий кольори. Акцентні кольори Glow Node Cyan #00f5d4 та Vector Path Pink #ffa69e. Палітра має температуру кольорів Нейтральний, Холодний, Теплий.

За світлістю палітра сягає від #090909 (найтемніший) до #F8F8F8 (найсвітліший). Діапазон світлості широкий.

Насиченість змішана — є приглушені й більш яскраві акценти.

Деякі пари відтінків близькі до комплементарних позицій — можливе читання як комплементарний контраст (евристика).

Загалом температура зміщена в бік холодного.

HEX-коди (відсортовано): #00F5D4, #090909, #9D4EDD, #C4C4C4, #F8F8F8, #FFA69E

Палітра Dark Matter UI Component Pack містить комбінацію з 6 кодів кольорів :

HEX: #090909, RGB: (9, 9, 9); HEX: #00f5d4, RGB: (0, 245, 212); HEX: #c4c4c4, RGB: (196, 196, 196)

HEX: #ffa69e, RGB: (255, 166, 158); HEX: #f8f8f8, RGB: (248, 248, 248); HEX: #9d4edd, RGB: (157, 78, 221)

Спрощений варіант палітри кольорів

Відтінок Чорний, Відтінок aquamarine, Відтінок Срібний, Відтінок lightpink, Відтінок whitesmoke, Відтінок darkorchid

Кольорова схема створена автором coolor

Більше палітр з:

Коди кольорів у палітрі

Dark Matter UI Component Pack коди кольорів HEX, RGB інформація у таблиці

Колір	HEX	RGB	Назва	Альтернативна назва
#090909	#090909	RGB(9, 9, 9)	Matter Base Black	—
#00f5d4	#00f5d4	RGB(0, 245, 212)	Glow Node Cyan	—
#c4c4c4	#c4c4c4	RGB(196, 196, 196)	Panel Dust Grey	Weathered Stone
#ffa69e	#ffa69e	RGB(255, 166, 158)	Vector Path Pink	—
#f8f8f8	#f8f8f8	RGB(248, 248, 248)	Hover State White	—
#9d4edd	#9d4edd	RGB(157, 78, 221)	Data Stripe Violet	—

Контраст палітри кольорів

6 пари кольорів мають низький контраст і потребують покращення, що може вплинути на зручність читання.

Колір тексту	Колір фону	Коефіцієнт контрастності
#00f5d4	#c4c4c4	1.24
#00f5d4	#ffa69e	1.34
#00f5d4	#f8f8f8	1.31
#c4c4c4	#ffa69e	1.07
#c4c4c4	#f8f8f8	1.64
#ffa69e	#f8f8f8	1.76

Зображення палітри Dark Matter UI Component Pack png

--color-matter-base-black:	#090909;
--color-glow-node-cyan:	#00f5d4;
--color-panel-dust-grey:	#c4c4c4;
--color-vector-path-pink:	#ffa69e;
--color-hover-state-white:	#f8f8f8;
--color-data-stripe-violet:	#9d4edd;

$color-matter-base-black:	#090909;
$color-glow-node-cyan:	#00f5d4;
$color-panel-dust-grey:	#c4c4c4;
$color-vector-path-pink:	#ffa69e;
$color-hover-state-white:	#f8f8f8;
$color-data-stripe-violet:	#9d4edd;

@color-matter-base-black:	#090909;
@color-glow-node-cyan:	#00f5d4;
@color-panel-dust-grey:	#c4c4c4;
@color-vector-path-pink:	#ffa69e;
@color-hover-state-white:	#f8f8f8;
@color-data-stripe-violet:	#9d4edd;