Dandy Flower カラーパレット

明るさ

彩度

暖かさ

UI Examples

Explore beautiful UI components with Dandy Flower palette

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

Dandy Flower カラー パレット PNG 画像

Download dandy flower color palette PNG image (landscape)
Download dandy flower color palette PNG image (square)

Dandy Flower カラーパレット CSS

/* CSS */
.color-1 {
color: #f8c749;
}
.color-2 {
color: #f0a64c;
}
.color-3 {
color: #e77a4b;
}
.color-4 {
color: #d7708f;
}
.color-5 {
color: #a55f9e;
}

/* CSS Variables */
:root {
--color-1: #f8c749;
 --color-2: #f0a64c;
 --color-3: #e77a4b;
 --color-4: #d7708f;
 --color-5: #a55f9e;
 }

Dandy Flower の背景のグラデーション CSS

/* Linear Gradient */
.linear-gradient {
background: linear-gradient(0.25turn, #f8c749, #f0a64c, #e77a4b, #d7708f, #a55f9e);
}
/* Radial Gradient */
.radial-gradient {
background: radial-gradient(circle, #f8c749, #f0a64c, #e77a4b, #d7708f, #a55f9e);
}

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

Dandy Flower color palette created on .