Starbreaker カラーパレット

明るさ

彩度

暖かさ

UI Examples

Explore beautiful UI components with Starbreaker palette

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

Starbreaker カラー パレット PNG 画像

Download starbreaker color palette PNG image (landscape)
Download starbreaker color palette PNG image (square)

Starbreaker カラーパレット CSS

/* CSS */
.color-1 {
color: #1c1f3b;
}
.color-2 {
color: #3a4b69;
}
.color-3 {
color: #4e7b8d;
}
.color-4 {
color: #88c8a1;
}
.color-5 {
color: #f9c54e;
}

/* CSS Variables */
:root {
--color-1: #1c1f3b;
 --color-2: #3a4b69;
 --color-3: #4e7b8d;
 --color-4: #88c8a1;
 --color-5: #f9c54e;
 }

Starbreaker の背景のグラデーション CSS

/* Linear Gradient */
.linear-gradient {
background: linear-gradient(0.25turn, #1c1f3b, #3a4b69, #4e7b8d, #88c8a1, #f9c54e);
}
/* Radial Gradient */
.radial-gradient {
background: radial-gradient(circle, #1c1f3b, #3a4b69, #4e7b8d, #88c8a1, #f9c54e);
}

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

Starbreaker color palette created on .