Honeyed Whimsy カラーパレット

明るさ

彩度

暖かさ

UI Examples

Explore beautiful UI components with Honeyed Whimsy palette

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

Honeyed Whimsy カラーパレット (PNG) をダウンロード

Download honeyed whimsy color palette PNG image (landscape)
Download honeyed whimsy color palette PNG image (square)

Honeyed Whimsy カラーパレット CSS

/* CSS */
.color-1 {
color: #f5c147;
}
.color-2 {
color: #f8cb8b;
}
.color-3 {
color: #fde2b4;
}
.color-4 {
color: #ffe9d6;
}
.color-5 {
color: #fff1db;
}

/* CSS Variables */
:root {
--color-1: #f5c147;
 --color-2: #f8cb8b;
 --color-3: #fde2b4;
 --color-4: #ffe9d6;
 --color-5: #fff1db;
 }

Honeyed Whimsy の背景のグラデーション CSS

/* Linear Gradient */
.linear-gradient {
background: linear-gradient(0.25turn, #f5c147, #f8cb8b, #fde2b4, #ffe9d6, #fff1db);
}
/* Radial Gradient */
.radial-gradient {
background: radial-gradient(circle, #f5c147, #f8cb8b, #fde2b4, #ffe9d6, #fff1db);
}

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

Honeyed Whimsy color palette created on .