Reactive Frontend Layout Builder

DOM Cyan
#20d3c2
Grid Gray
#dadada
Render Blush
#ffadad
Transition Night
#1b1c22
State Lilac
#b8b3e9
Align White
#ffffff

Paleta składa się z kolorów Światło, Ciemny. Kolory akcentujące DOM Cyan #20d3c2 i Render Blush #ffadad. Paleta ma temperaturę kolorów Zimny, Neutralny, Ciepły.

Według jasności paleta rozciąga się od #1B1C22 (najciemniejszy) do #FFFFFF (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): #1B1C22, #20D3C2, #B8B3E9, #DADADA, #FFADAD, #FFFFFF

Paleta Reactive Frontend Layout Builder zawiera kombinację kolorów kodów 6:

KLĄTWA: #20d3c2, RGB: (32, 211, 194); KLĄTWA: #dadada, RGB: (218, 218, 218); KLĄTWA: #ffadad, RGB: (255, 173, 173)

KLĄTWA: #1b1c22, RGB: (27, 28, 34); KLĄTWA: #b8b3e9, RGB: (184, 179, 233); KLĄTWA: #ffffff, RGB: (255, 255, 255)

Uproszczona wersja palety kolorów

Odcień turquoise, Odcień gainsboro, Odcień lightpink, Cień Czarny, Odcień lightsteelblue, Biały

Schemat kolorów został stworzony przez palettespicker

Więcej palet z:

Kody kolorów w palecie

Reactive Frontend Layout Builder kody kolorów HEX, informacje RGB w tabeli

Kolor	KLĄTWA	RGB	Nazwa	alternatywne imie
#20d3c2	#20d3c2	RGB(32, 211, 194)	DOM Cyan	—
#dadada	#dadada	RGB(218, 218, 218)	Grid Gray	—
#ffadad	#ffadad	RGB(255, 173, 173)	Render Blush	—
#1b1c22	#1b1c22	RGB(27, 28, 34)	Transition Night	—
#b8b3e9	#b8b3e9	RGB(184, 179, 233)	State Lilac	—
#ffffff	#ffffff	RGB(255, 255, 255)	Align White	White

Kontrast palety kolorów

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

Kolor tekstu	Kolor tła	Współczynnik kontrastu
#20d3c2	#dadada	1.34
#20d3c2	#ffadad	1.06
#20d3c2	#b8b3e9	1.04
#20d3c2	#ffffff	1.88
#dadada	#ffadad	1.26
#dadada	#b8b3e9	1.4

Paleta obrazów Reactive Frontend Layout Builder png

Reactive Frontend Layout Builder - #552539

--color-dom-cyan:	#20d3c2;
--color-grid-gray:	#dadada;
--color-render-blush:	#ffadad;
--color-transition-night:	#1b1c22;
--color-state-lilac:	#b8b3e9;
--color-align-white:	#ffffff;

$color-dom-cyan:	#20d3c2;
$color-grid-gray:	#dadada;
$color-render-blush:	#ffadad;
$color-transition-night:	#1b1c22;
$color-state-lilac:	#b8b3e9;
$color-align-white:	#ffffff;

@color-dom-cyan:	#20d3c2;
@color-grid-gray:	#dadada;
@color-render-blush:	#ffadad;
@color-transition-night:	#1b1c22;
@color-state-lilac:	#b8b3e9;
@color-align-white:	#ffffff;