Sakura Night Haiku カラーパレット

明るさ

彩度

暖かさ

UI Examples

Explore beautiful UI components with Sakura Night Haiku palette

カラーインスピレーション

実際のデザインでこのカラーパレットを紹介する画像

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

Sakura Night Haiku カラーパレット (PNG) をダウンロード

Download sakura night haiku color palette PNG image (landscape)
Download sakura night haiku color palette PNG image (square)

Sakura Night Haiku カラーパレット CSS

/* CSS */
.color-1 {
color: #f4c3d6;
}
.color-2 {
color: #eab8d1;
}
.color-3 {
color: #d18fbe;
}
.color-4 {
color: #a76c9d;
}
.color-5 {
color: #7a4b81;
}

/* CSS Variables */
:root {
--color-1: #f4c3d6;
 --color-2: #eab8d1;
 --color-3: #d18fbe;
 --color-4: #a76c9d;
 --color-5: #7a4b81;
 }

Sakura Night Haiku の背景のグラデーション CSS

/* Linear Gradient */
.linear-gradient {
background: linear-gradient(0.25turn, #f4c3d6, #eab8d1, #d18fbe, #a76c9d, #7a4b81);
}
/* Radial Gradient */
.radial-gradient {
background: radial-gradient(circle, #f4c3d6, #eab8d1, #d18fbe, #a76c9d, #7a4b81);
}

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

Sakura Night Haiku color palette created on .