Framer Motion UI Concepts

Smooth Peach
#fdd9c1
Motion Black
#1a1a1a
Fade Rose
#ffc4d6
Velvet Indigo
#4c4c9d
Soft Scroll Gray
#dcdcdc

Palet terdiri dari Lampu, Gelap, Setengah gelap warna. Warna aksen Smooth Peach #fdd9c1 Dan Fade Rose #ffc4d6. Palet memiliki suhu warna Hangat, Netral, Dingin.

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

Saturasi campuran — ada swatch redup dan aksen lebih cerah.

Rona tersebar luas pada roda — palet bervariasi (heuristik).

Sebagian besar sampel terbaca netral dalam suhu warna.

Kode HEX (diurutkan): #1A1A1A, #4C4C9D, #DCDCDC, #FDD9C1, #FFC4D6

Palette Framer Motion UI Concepts memiliki kombinasi warna kode 5:

HEX: #fdd9c1, RGB: (253, 217, 193); HEX: #1a1a1a, RGB: (26, 26, 26); HEX: #ffc4d6, RGB: (255, 196, 214)

HEX: #4c4c9d, RGB: (76, 76, 157); HEX: #dcdcdc, RGB: (220, 220, 220)

Versi warna palet yang disederhanakan

Warna dari peachpuff, Bayangan dari Hitam, Bayangan dari Merah Jambu, Bayangan dari darkslateblue

Skema warna diciptakan oleh colorday

Lebih banyak palet dengan:

Kode warna dalam palet

Framer Motion UI Concepts kode warna HEX, informasi RGB dalam tabel

Warna	HEX	RGB	Nama	nama alternatif
#fdd9c1	#fdd9c1	RGB(253, 217, 193)	Smooth Peach	—
#1a1a1a	#1a1a1a	RGB(26, 26, 26)	Motion Black	Gray10
#ffc4d6	#ffc4d6	RGB(255, 196, 214)	Fade Rose	—
#4c4c9d	#4c4c9d	RGB(76, 76, 157)	Velvet Indigo	—
#dcdcdc	#dcdcdc	RGB(220, 220, 220)	Soft Scroll Gray	Gainsboro

Kontras Palet Warna

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

Warna teks	Warna latar belakang	Rasio Kontras
#fdd9c1	#ffc4d6	1.12
#fdd9c1	#dcdcdc	1.03
#ffc4d6	#dcdcdc	1.08

Palet gambar Framer Motion UI Concepts png

--color-smooth-peach:	#fdd9c1;
--color-motion-black:	#1a1a1a;
--color-fade-rose:	#ffc4d6;
--color-velvet-indigo:	#4c4c9d;
--color-soft-scroll-gray:	#dcdcdc;

$color-smooth-peach:	#fdd9c1;
$color-motion-black:	#1a1a1a;
$color-fade-rose:	#ffc4d6;
$color-velvet-indigo:	#4c4c9d;
$color-soft-scroll-gray:	#dcdcdc;

@color-smooth-peach:	#fdd9c1;
@color-motion-black:	#1a1a1a;
@color-fade-rose:	#ffc4d6;
@color-velvet-indigo:	#4c4c9d;
@color-soft-scroll-gray:	#dcdcdc;