Design Tokens Light UI Kit

Base Linen
#faf8f5
Primary Teal
#00cfc1
Accent Rose
#ffb4a2
Info Indigo
#6c63ff
Border Fog
#e5e5e5
Interactive Charcoal
#222222

La palette se compose de Lumière, Sombre couleurs. Couleurs d'accent Primary Teal #00cfc1 et Accent Rose #ffb4a2. La palette a une température de couleur Neutre, Froid, Chaud.

En luminosité, cette palette va de #222222 (plus sombre) à #FAF8F5 (plus clair). L’écart de luminosité est large.

Saturation mixte — passages atténués et accents plus vifs.

Certaines paires sont proches de positions complémentaires — effet possible de contraste (heuristique).

La température globale penche vers le froid.

Codes HEX (triés) : #00CFC1, #222222, #6C63FF, #E5E5E5, #FAF8F5, #FFB4A2

La palette Design Tokens Light UI Kit a une combinaison de couleurs de codes 6:

HEX: #faf8f5, RVB: (250, 248, 245); HEX: #00cfc1, RVB: (0, 207, 193); HEX: #ffb4a2, RVB: (255, 180, 162)

HEX: #6c63ff, RVB: (108, 99, 255); HEX: #e5e5e5, RVB: (229, 229, 229); HEX: #222222, RVB: (34, 34, 34)

Version simplifiée des couleurs de la palette

Ombre de whitesmoke, Nuance de mediumturquoise, Ombre de lightsalmon, Nuance de mediumslateblue, Ombre de gainsboro, Ombre de Noir

Le jeu de couleurs a été créé par hex

Plus de palettes avec:

Codes couleurs dans la palette

Design Tokens Light UI Kit codes de couleur HEX, informations RVB dans le tableau

Couleur	HEX	RVB	Nom	Autre nom
#faf8f5	#faf8f5	RVB(250, 248, 245)	Base Linen	—
#00cfc1	#00cfc1	RVB(0, 207, 193)	Primary Teal	—
#ffb4a2	#ffb4a2	RVB(255, 180, 162)	Accent Rose	—
#6c63ff	#6c63ff	RVB(108, 99, 255)	Info Indigo	—
#e5e5e5	#e5e5e5	RVB(229, 229, 229)	Border Fog	Gray90
#222222	#222222	RVB(34, 34, 34)	Interactive Charcoal	Black Out

Contraste de la palette de couleurs

6 paires de couleurs ont un faible contraste et nécessitent des améliorations, ce qui peut affecter la lisibilité.

Couleur du texte	Couleur de l'arrière plan	Rapport de contraste
#faf8f5	#00cfc1	1.85
#faf8f5	#ffb4a2	1.61
#faf8f5	#e5e5e5	1.18
#00cfc1	#ffb4a2	1.15
#00cfc1	#e5e5e5	1.55
#ffb4a2	#e5e5e5	1.35

Palette d'images Design Tokens Light UI Kit png

--color-base-linen:	#faf8f5;
--color-primary-teal:	#00cfc1;
--color-accent-rose:	#ffb4a2;
--color-info-indigo:	#6c63ff;
--color-border-fog:	#e5e5e5;
--color-interactive-charcoal:	#222222;

$color-base-linen:	#faf8f5;
$color-primary-teal:	#00cfc1;
$color-accent-rose:	#ffb4a2;
$color-info-indigo:	#6c63ff;
$color-border-fog:	#e5e5e5;
$color-interactive-charcoal:	#222222;

@color-base-linen:	#faf8f5;
@color-primary-teal:	#00cfc1;
@color-accent-rose:	#ffb4a2;
@color-info-indigo:	#6c63ff;
@color-border-fog:	#e5e5e5;
@color-interactive-charcoal:	#222222;