Aster Bloom カラーパレット

明るさ

彩度

暖かさ

UI Examples

Explore beautiful UI components with Aster Bloom palette

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

Aster Bloom カラー パレット PNG 画像

Download aster bloom color palette PNG image (landscape)
Download aster bloom color palette PNG image (square)

Aster Bloom カラーパレット CSS

/* CSS */
.color-1 {
color: #a6c6ed;
}
.color-2 {
color: #e1b5e8;
}
.color-3 {
color: #f6c7a7;
}
.color-4 {
color: #f5d76b;
}
.color-5 {
color: #e7a2c0;
}

/* CSS Variables */
:root {
--color-1: #a6c6ed;
 --color-2: #e1b5e8;
 --color-3: #f6c7a7;
 --color-4: #f5d76b;
 --color-5: #e7a2c0;
 }

Aster Bloom の背景のグラデーション CSS

/* Linear Gradient */
.linear-gradient {
background: linear-gradient(0.25turn, #a6c6ed, #e1b5e8, #f6c7a7, #f5d76b, #e7a2c0);
}
/* Radial Gradient */
.radial-gradient {
background: radial-gradient(circle, #a6c6ed, #e1b5e8, #f6c7a7, #f5d76b, #e7a2c0);
}

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

Aster Bloom color palette created on .