Seafoam Reactive Grid

Primary Teal
#3eb3a7
Secondary Mint
#a2ded0
Accent Yellow
#ffd166
Background Ice
#f9fcfb
Surface Pale Mint
#e3f5ef
Text Slate
#1d2c2e

Paleta składa się z kolorów Światło, Ciemny. Kolory akcentujące Primary Teal #3eb3a7 i Accent Yellow #ffd166. Paleta ma temperaturę kolorów Zimny, Ciepły, Neutralny.

Według jasności paleta rozciąga się od #1D2C2E (najciemniejszy) do #F9FCFB (najjaśniejszy). Zakres jasności jest szeroki.

Nasycenie jest mieszane — część próbek stonowana, część żywsza.

Niektóre pary barw są blisko pozycji dopełniających — można to odczytać jako kontrast dopełniający (heurystyka).

Ogólna temperatura barw przechyla się ku zimnu.

Kody HEX (posortowane): #1D2C2E, #3EB3A7, #A2DED0, #E3F5EF, #F9FCFB, #FFD166

Paleta Seafoam Reactive Grid zawiera kombinację kolorów kodów 6:

KLĄTWA: #3eb3a7, RGB: (62, 179, 167); KLĄTWA: #a2ded0, RGB: (162, 222, 208); KLĄTWA: #ffd166, RGB: (255, 209, 102)

KLĄTWA: #f9fcfb, RGB: (249, 252, 251); KLĄTWA: #e3f5ef, RGB: (227, 245, 239); KLĄTWA: #1d2c2e, RGB: (29, 44, 46)

Uproszczona wersja palety kolorów

Cień lightseagreen, Odcień paleturquoise, Cień gold, Odcień Biały, Odcień mintcream, Odcień darkslategrey

Schemat kolorów został stworzony przez raccoon

Więcej palet z:

Kody kolorów w palecie

Seafoam Reactive Grid kody kolorów HEX, informacje RGB w tabeli

Kolor	KLĄTWA	RGB	Nazwa	alternatywne imie
#3eb3a7	#3eb3a7	RGB(62, 179, 167)	Primary Teal	—
#a2ded0	#a2ded0	RGB(162, 222, 208)	Secondary Mint	—
#ffd166	#ffd166	RGB(255, 209, 102)	Accent Yellow	—
#f9fcfb	#f9fcfb	RGB(249, 252, 251)	Background Ice	—
#e3f5ef	#e3f5ef	RGB(227, 245, 239)	Surface Pale Mint	—
#1d2c2e	#1d2c2e	RGB(29, 44, 46)	Text Slate	—

Kontrast palety kolorów

8 pary kolorów mają niski kontrast i wymagają poprawy, co może wpłynąć na czytelność.

Kolor tekstu	Kolor tła	Współczynnik kontrastu
#3eb3a7	#a2ded0	1.69
#3eb3a7	#ffd166	1.77
#a2ded0	#ffd166	1.04
#a2ded0	#f9fcfb	1.46
#a2ded0	#e3f5ef	1.33
#ffd166	#f9fcfb	1.39

Paleta obrazów Seafoam Reactive Grid png

--color-primary-teal:	#3eb3a7;
--color-secondary-mint:	#a2ded0;
--color-accent-yellow:	#ffd166;
--color-background-ice:	#f9fcfb;
--color-surface-pale-mint:	#e3f5ef;
--color-text-slate:	#1d2c2e;

$color-primary-teal:	#3eb3a7;
$color-secondary-mint:	#a2ded0;
$color-accent-yellow:	#ffd166;
$color-background-ice:	#f9fcfb;
$color-surface-pale-mint:	#e3f5ef;
$color-text-slate:	#1d2c2e;

@color-primary-teal:	#3eb3a7;
@color-secondary-mint:	#a2ded0;
@color-accent-yellow:	#ffd166;
@color-background-ice:	#f9fcfb;
@color-surface-pale-mint:	#e3f5ef;
@color-text-slate:	#1d2c2e;