Cross-Platform Design System UI

Unified Indigo
#5b5f97
Platform Cream
#fff8f0
Sync Sky
#87e8ff
Viewport Onyx
#1e1e1e
Deploy Rose
#ff91a4
Token Clay
#d7ccc8
Breakpoints Lime
#daffb3

Palet terdiri dari Setengah gelap, Lampu, Gelap warna. Warna aksen Platform Cream #fff8f0 Dan Sync Sky #87e8ff. Palet memiliki suhu warna Dingin, Netral, Hangat.

Menurut kecerahan, palet ini dari #1E1E1E (paling gelap) ke #FFF8F0 (paling terang). Rentang kecerahan lebar.

Saturasi keseluruhan terasa hidup (chroma tinggi).

Beberapa pasangan rona dekat posisi komplementer — dapat terbaca sebagai kontras komplementer (heuristik).

Sebagian besar sampel terbaca netral dalam suhu warna.

Kode HEX (diurutkan): #1E1E1E, #5B5F97, #87E8FF, #D7CCC8, #DAFFB3, #FF91A4, #FFF8F0

Palette Cross-Platform Design System UI memiliki kombinasi warna kode 7:

HEX: #5b5f97, RGB: (91, 95, 151); HEX: #fff8f0, RGB: (255, 248, 240); HEX: #87e8ff, RGB: (135, 232, 255)

HEX: #1e1e1e, RGB: (30, 30, 30); HEX: #ff91a4, RGB: (255, 145, 164); HEX: #d7ccc8, RGB: (215, 204, 200)

HEX: #daffb3, RGB: (218, 255, 179)

Versi warna palet yang disederhanakan

Warna dari slateblue, Warna dari floralwhite, Bayangan dari skyblue, Bayangan dari Hitam, Bayangan dari lightcoral, Warna dari lightgrey, Bayangan dari palegreen

Skema warna diciptakan oleh colorslib

Lebih banyak palet dengan:

Kode warna dalam palet

Cross-Platform Design System UI kode warna HEX, informasi RGB dalam tabel

Warna	HEX	RGB	Nama	nama alternatif
#5b5f97	#5b5f97	RGB(91, 95, 151)	Unified Indigo	—
#fff8f0	#fff8f0	RGB(255, 248, 240)	Platform Cream	—
#87e8ff	#87e8ff	RGB(135, 232, 255)	Sync Sky	—
#1e1e1e	#1e1e1e	RGB(30, 30, 30)	Viewport Onyx	—
#ff91a4	#ff91a4	RGB(255, 145, 164)	Deploy Rose	Salmon Pink
#d7ccc8	#d7ccc8	RGB(215, 204, 200)	Token Clay	—
#daffb3	#daffb3	RGB(218, 255, 179)	Breakpoints Lime	—

Kontras Palet Warna

9 pasangan warna memiliki kontras rendah dan perlu perbaikan, yang dapat memengaruhi keterbacaan.

Warna teks	Warna latar belakang	Rasio Kontras
#fff8f0	#87e8ff	1.32
#fff8f0	#d7ccc8	1.49
#fff8f0	#daffb3	1.05
#87e8ff	#ff91a4	1.52
#87e8ff	#d7ccc8	1.12
#87e8ff	#daffb3	1.26

Palet gambar Cross-Platform Design System UI png

Cross-Platform Design System UI - #555153

--color-unified-indigo:	#5b5f97;
--color-platform-cream:	#fff8f0;
--color-sync-sky:	#87e8ff;
--color-viewport-onyx:	#1e1e1e;
--color-deploy-rose:	#ff91a4;
--color-token-clay:	#d7ccc8;
--color-breakpoints-lime:	#daffb3;

$color-unified-indigo:	#5b5f97;
$color-platform-cream:	#fff8f0;
$color-sync-sky:	#87e8ff;
$color-viewport-onyx:	#1e1e1e;
$color-deploy-rose:	#ff91a4;
$color-token-clay:	#d7ccc8;
$color-breakpoints-lime:	#daffb3;

@color-unified-indigo:	#5b5f97;
@color-platform-cream:	#fff8f0;
@color-sync-sky:	#87e8ff;
@color-viewport-onyx:	#1e1e1e;
@color-deploy-rose:	#ff91a4;
@color-token-clay:	#d7ccc8;
@color-breakpoints-lime:	#daffb3;