Springfield Sunset カラーパレット

明るさ

彩度

暖かさ

UI Examples

Explore beautiful UI components with Springfield Sunset palette

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

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

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

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

Download springfield sunset color palette PNG image (landscape)
Download springfield sunset color palette PNG image (square)

Springfield Sunset カラーパレット CSS

/* CSS */
.color-1 {
color: #f7c750;
}
.color-2 {
color: #e5a82e;
}
.color-3 {
color: #d65b2e;
}
.color-4 {
color: #5d8cc0;
}
.color-5 {
color: #f0a3a5;
}

/* CSS Variables */
:root {
--color-1: #f7c750;
 --color-2: #e5a82e;
 --color-3: #d65b2e;
 --color-4: #5d8cc0;
 --color-5: #f0a3a5;
 }

Springfield Sunset の背景のグラデーション CSS

/* Linear Gradient */
.linear-gradient {
background: linear-gradient(0.25turn, #f7c750, #e5a82e, #d65b2e, #5d8cc0, #f0a3a5);
}
/* Radial Gradient */
.radial-gradient {
background: radial-gradient(circle, #f7c750, #e5a82e, #d65b2e, #5d8cc0, #f0a3a5);
}

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

Springfield Sunset color palette created on .