Spectrum of Solace カラーパレット

明るさ

彩度

暖かさ

UI Examples

Explore beautiful UI components with Spectrum of Solace palette

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

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

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

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

Download spectrum of solace color palette PNG image (landscape)
Download spectrum of solace color palette PNG image (square)

Spectrum of Solace カラーパレット CSS

/* CSS */
.color-1 {
color: #f4a462;
}
.color-2 {
color: #2a9d90;
}
.color-3 {
color: #274754;
}
.color-4 {
color: #e76e50;
}
.color-5 {
color: #f9c54e;
}

/* CSS Variables */
:root {
--color-1: #f4a462;
 --color-2: #2a9d90;
 --color-3: #274754;
 --color-4: #e76e50;
 --color-5: #f9c54e;
 }

Spectrum of Solace の背景のグラデーション CSS

/* Linear Gradient */
.linear-gradient {
background: linear-gradient(0.25turn, #f4a462, #2a9d90, #274754, #e76e50, #f9c54e);
}
/* Radial Gradient */
.radial-gradient {
background: radial-gradient(circle, #f4a462, #2a9d90, #274754, #e76e50, #f9c54e);
}

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

Spectrum of Solace color palette created on .