Trailblazer Fusion カラーパレット

明るさ

彩度

暖かさ

UI Examples

Explore beautiful UI components with Trailblazer Fusion palette

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

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

Download trailblazer fusion color palette PNG image (landscape)
Download trailblazer fusion color palette PNG image (square)

Trailblazer Fusion カラーパレット CSS

/* CSS */
.color-1 {
color: #f1c40e;
}
.color-2 {
color: #e77e23;
}
.color-3 {
color: #d15400;
}
.color-4 {
color: #287fb8;
}
.color-5 {
color: #8d43ad;
}

/* CSS Variables */
:root {
--color-1: #f1c40e;
 --color-2: #e77e23;
 --color-3: #d15400;
 --color-4: #287fb8;
 --color-5: #8d43ad;
 }

Trailblazer Fusion の背景のグラデーション CSS

/* Linear Gradient */
.linear-gradient {
background: linear-gradient(0.25turn, #f1c40e, #e77e23, #d15400, #287fb8, #8d43ad);
}
/* Radial Gradient */
.radial-gradient {
background: radial-gradient(circle, #f1c40e, #e77e23, #d15400, #287fb8, #8d43ad);
}

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

Trailblazer Fusion color palette created on .