Composable Web Component Theme

Slot Sky
#89cff0
Shadow DOM Slate
#66757f
Element White
#fafafa
Template Violet
#b497d6
Bind Coral
#ff847c
Layout Charcoal
#2a2a2a

Paleta składa się z kolorów Światło, Ciemny. Kolory akcentujące Slot Sky #89cff0 i Bind Coral #ff847c. Paleta ma temperaturę kolorów Zimny, Neutralny, Ciepły.

Według jasności paleta rozciąga się od #2A2A2A (najciemniejszy) do #FAFAFA (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): #2A2A2A, #66757F, #89CFF0, #B497D6, #FAFAFA, #FF847C

Paleta Composable Web Component Theme zawiera kombinację kolorów kodów 6:

KLĄTWA: #89cff0, RGB: (137, 207, 240); KLĄTWA: #66757f, RGB: (102, 117, 127); KLĄTWA: #fafafa, RGB: (250, 250, 250)

KLĄTWA: #b497d6, RGB: (180, 151, 214); KLĄTWA: #ff847c, RGB: (255, 132, 124); KLĄTWA: #2a2a2a, RGB: (42, 42, 42)

Uproszczona wersja palety kolorów

Cień skyblue, Odcień slategrey, Cień whitesmoke, Odcień plum, Cień salmon, Cień Czarny

Schemat kolorów został stworzony przez colorslib

Więcej palet z:

Kody kolorów w palecie

Composable Web Component Theme kody kolorów HEX, informacje RGB w tabeli

Kolor	KLĄTWA	RGB	Nazwa	alternatywne imie
#89cff0	#89cff0	RGB(137, 207, 240)	Slot Sky	Pool Tiles
#66757f	#66757f	RGB(102, 117, 127)	Shadow DOM Slate	—
#fafafa	#fafafa	RGB(250, 250, 250)	Element White	Dr. White
#b497d6	#b497d6	RGB(180, 151, 214)	Template Violet	—
#ff847c	#ff847c	RGB(255, 132, 124)	Bind Coral	—
#2a2a2a	#2a2a2a	RGB(42, 42, 42)	Layout Charcoal	The End

Kontrast palety kolorów

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

Kolor tekstu	Kolor tła	Współczynnik kontrastu
#89cff0	#fafafa	1.64
#89cff0	#b497d6	1.46
#89cff0	#ff847c	1.38
#66757f	#b497d6	1.88
#b497d6	#ff847c	1.06

Paleta obrazów Composable Web Component Theme png

Composable Web Component Theme - #555351

--color-slot-sky:	#89cff0;
--color-shadow-dom-slate:	#66757f;
--color-element-white:	#fafafa;
--color-template-violet:	#b497d6;
--color-bind-coral:	#ff847c;
--color-layout-charcoal:	#2a2a2a;

$color-slot-sky:	#89cff0;
$color-shadow-dom-slate:	#66757f;
$color-element-white:	#fafafa;
$color-template-violet:	#b497d6;
$color-bind-coral:	#ff847c;
$color-layout-charcoal:	#2a2a2a;

@color-slot-sky:	#89cff0;
@color-shadow-dom-slate:	#66757f;
@color-element-white:	#fafafa;
@color-template-violet:	#b497d6;
@color-bind-coral:	#ff847c;
@color-layout-charcoal:	#2a2a2a;