Mobile First Accessibility Kit

Readability Navy
#1d2545
Tap Yellow
#fff176
Focus Ring Aqua
#38f3e2
Content Vanilla
#fdf4e3
Contrast Coral
#fa7268
Clear Text Gray
#3b3b3b

Палитра содержит темный, светлый цвета. Акцентные цвета Tap Yellow #fff176 да Focus Ring Aqua #38f3e2. Палитра имеет цветовую температуру Холодный, Теплый, Нейтральный.

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

В целом насыщенность выглядит яркой (высокая хрома).

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

Тёплые и холодные элементы довольно сбалансированы.

HEX-коды (по возрастанию): #1D2545, #38F3E2, #3B3B3B, #FA7268, #FDF4E3, #FFF176

Палитра Mobile First Accessibility Kit содержит комбинацию из 6 кодов цветов:

HEX: #1d2545, RGB: (29, 37, 69); HEX: #fff176, RGB: (255, 241, 118); HEX: #38f3e2, RGB: (56, 243, 226)

HEX: #fdf4e3, RGB: (253, 244, 227); HEX: #fa7268, RGB: (250, 114, 104); HEX: #3b3b3b, RGB: (59, 59, 59)

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

Тень midnightblue, Тень хаки, Тень turquoise, Оттенок oldlace, Оттенок salmon, Оттенок darkslategrey

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

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

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

Mobile First Accessibility Kit коды цветов HEX, RGB информация в таблице

Цвет	HEX	RGB	Название	Альтернативное название
#1d2545	#1d2545	RGB(29, 37, 69)	Readability Navy	—
#fff176	#fff176	RGB(255, 241, 118)	Tap Yellow	—
#38f3e2	#38f3e2	RGB(56, 243, 226)	Focus Ring Aqua	—
#fdf4e3	#fdf4e3	RGB(253, 244, 227)	Content Vanilla	—
#fa7268	#fa7268	RGB(250, 114, 104)	Contrast Coral	—
#3b3b3b	#3b3b3b	RGB(59, 59, 59)	Clear Text Gray	Gray23

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

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

Цвет текста	Цвет фона	Коэффициент контрастности
#1d2545	#3b3b3b	1.33
#fff176	#38f3e2	1.19
#fff176	#fdf4e3	1.06
#38f3e2	#fdf4e3	1.27
#38f3e2	#fa7268	1.96

Изображение палитры Mobile First Accessibility Kit png

Mobile First Accessibility Kit - #552247

--color-readability-navy:	#1d2545;
--color-tap-yellow:	#fff176;
--color-focus-ring-aqua:	#38f3e2;
--color-content-vanilla:	#fdf4e3;
--color-contrast-coral:	#fa7268;
--color-clear-text-gray:	#3b3b3b;

$color-readability-navy:	#1d2545;
$color-tap-yellow:	#fff176;
$color-focus-ring-aqua:	#38f3e2;
$color-content-vanilla:	#fdf4e3;
$color-contrast-coral:	#fa7268;
$color-clear-text-gray:	#3b3b3b;

@color-readability-navy:	#1d2545;
@color-tap-yellow:	#fff176;
@color-focus-ring-aqua:	#38f3e2;
@color-content-vanilla:	#fdf4e3;
@color-contrast-coral:	#fa7268;
@color-clear-text-gray:	#3b3b3b;