Prancing Pony カラーパレット

明るさ

彩度

暖かさ

UI Examples

Explore beautiful UI components with Prancing Pony palette

このパレットを共有する先：

Prancing Pony カラー パレット PNG 画像

Download prancing pony color palette PNG image (landscape)
Download prancing pony color palette PNG image (square)

Prancing Pony カラーパレット CSS

/* CSS */
.color-1 {
color: #f5e0a3;
}
.color-2 {
color: #f3ccb4;
}
.color-3 {
color: #f39d8c;
}
.color-4 {
color: #d48cba;
}
.color-5 {
color: #a677b6;
}

/* CSS Variables */
:root {
--color-1: #f5e0a3;
 --color-2: #f3ccb4;
 --color-3: #f39d8c;
 --color-4: #d48cba;
 --color-5: #a677b6;
 }

Prancing Pony の背景のグラデーション CSS

/* Linear Gradient */
.linear-gradient {
background: linear-gradient(0.25turn, #f5e0a3, #f3ccb4, #f39d8c, #d48cba, #a677b6);
}
/* Radial Gradient */
.radial-gradient {
background: radial-gradient(circle, #f5e0a3, #f3ccb4, #f39d8c, #d48cba, #a677b6);
}

似たようなカラーパレット

Prancing Pony color palette created on .