Sakura Mochi カラーパレット

明るさ

彩度

暖かさ

UI Examples

Explore beautiful UI components with Sakura Mochi palette

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

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

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

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

Download sakura mochi color palette PNG image (landscape)
Download sakura mochi color palette PNG image (square)

Sakura Mochi カラーパレット CSS

/* CSS */
.color-1 {
color: #f6b6d7;
}
.color-2 {
color: #f3a0c2;
}
.color-3 {
color: #f1a2b7;
}
.color-4 {
color: #f4d5b3;
}
.color-5 {
color: #f4bab3;
}

/* CSS Variables */
:root {
--color-1: #f6b6d7;
 --color-2: #f3a0c2;
 --color-3: #f1a2b7;
 --color-4: #f4d5b3;
 --color-5: #f4bab3;
 }

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

/* Linear Gradient */
.linear-gradient {
background: linear-gradient(0.25turn, #f6b6d7, #f3a0c2, #f1a2b7, #f4d5b3, #f4bab3);
}
/* Radial Gradient */
.radial-gradient {
background: radial-gradient(circle, #f6b6d7, #f3a0c2, #f1a2b7, #f4d5b3, #f4bab3);
}

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

Sakura Mochi color palette created on .