Eurobeat カラーパレット

明るさ

彩度

暖かさ

UI Examples

Explore beautiful UI components with Eurobeat palette

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

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

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

Eurobeat カラーパレット CSS

/* CSS */
.color-1 {
color: #ff6d1f;
}
.color-2 {
color: #ffd000;
}
.color-3 {
color: #e2e600;
}
.color-4 {
color: #a1d24b;
}
.color-5 {
color: #0091ff;
}

/* CSS Variables */
:root {
--color-1: #ff6d1f;
 --color-2: #ffd000;
 --color-3: #e2e600;
 --color-4: #a1d24b;
 --color-5: #0091ff;
 }

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

/* Linear Gradient */
.linear-gradient {
background: linear-gradient(0.25turn, #ff6d1f, #ffd000, #e2e600, #a1d24b, #0091ff);
}
/* Radial Gradient */
.radial-gradient {
background: radial-gradient(circle, #ff6d1f, #ffd000, #e2e600, #a1d24b, #0091ff);
}

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

Eurobeat color palette created on .