Wireframe Lite UX System

Paper White
#ffffff
Stroke Charcoal
#3a3a3a
Hint Cyan
#b8fff9
Box Rust
#d65a31
Form Blue Grey
#90a4ae
Active Plum
#7e5a9b

La tavolozza è composta da Leggero colori. Colori accentati Hint Cyan #b8fff9 e Box Rust #d65a31. La tavolozza ha la temperatura del colore Neutro, Freddo, Caldo.

Per luminosità, la tavolozza va da #3A3A3A (più scuro) a #FFFFFF (più chiaro). L’intervallo di luminosità è ampio.

La saturazione complessiva risulta per lo più smorzata (croma basso).

Alcune coppie di tonalità sono vicine a posizioni complementari — si può leggere come contrasto complementare (euristica).

Complessivamente la temperatura tende al freddo.

Codici HEX (ordinati): #3A3A3A, #7E5A9B, #90A4AE, #B8FFF9, #D65A31, #FFFFFF

La tavolozza Wireframe Lite UX System ha una combinazione di colori dei codici 6:

ESADECIMALE: #ffffff, RGB: (255, 255, 255); ESADECIMALE: #3a3a3a, RGB: (58, 58, 58); ESADECIMALE: #b8fff9, RGB: (184, 255, 249)

ESADECIMALE: #d65a31, RGB: (214, 90, 49); ESADECIMALE: #90a4ae, RGB: (144, 164, 174); ESADECIMALE: #7e5a9b, RGB: (126, 90, 155)

Versione semplificata della tavolozza dei colori

Bianco, Tonalità di darkslategrey, Ombra di paleturquoise, Ombra di orangered, Tonalità di darkgrey, Ombra di slateblue

La combinazione di colori è stata creata da colorstudio

Altre tavolozze con:

Codici colori nella tavolozza

Wireframe Lite UX System codici colore HEX, informazioni RGB in tabella

Colore	ESADECIMALE	RGB	Nome	Nome alternativo
#ffffff	#ffffff	RGB(255, 255, 255)	Paper White	White
#3a3a3a	#3a3a3a	RGB(58, 58, 58)	Stroke Charcoal	—
#b8fff9	#b8fff9	RGB(184, 255, 249)	Hint Cyan	—
#d65a31	#d65a31	RGB(214, 90, 49)	Box Rust	—
#90a4ae	#90a4ae	RGB(144, 164, 174)	Form Blue Grey	—
#7e5a9b	#7e5a9b	RGB(126, 90, 155)	Active Plum	—

Contrasto della palette di colori

3 coppie di colori hanno un basso contrasto e necessitano di miglioramenti, il che può influire sulla leggibilità.

Colore del testo	Colore di sfondo	Rapporto di contrasto
#ffffff	#b8fff9	1.12
#d65a31	#90a4ae	1.51
#d65a31	#7e5a9b	1.4

Tavolozza immagini Wireframe Lite UX System png

--color-paper-white:	#ffffff;
--color-stroke-charcoal:	#3a3a3a;
--color-hint-cyan:	#b8fff9;
--color-box-rust:	#d65a31;
--color-form-blue-grey:	#90a4ae;
--color-active-plum:	#7e5a9b;

$color-paper-white:	#ffffff;
$color-stroke-charcoal:	#3a3a3a;
$color-hint-cyan:	#b8fff9;
$color-box-rust:	#d65a31;
$color-form-blue-grey:	#90a4ae;
$color-active-plum:	#7e5a9b;

@color-paper-white:	#ffffff;
@color-stroke-charcoal:	#3a3a3a;
@color-hint-cyan:	#b8fff9;
@color-box-rust:	#d65a31;
@color-form-blue-grey:	#90a4ae;
@color-active-plum:	#7e5a9b;