Frost カラーパレット

明るさ

彩度

暖かさ

UI Examples

Explore beautiful UI components with Frost palette

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

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

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

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

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

Frost カラーパレット CSS

/* CSS */
.color-1 {
color: #a8d3e1;
}
.color-2 {
color: #bed5da;
}
.color-3 {
color: #d4e8e3;
}
.color-4 {
color: #f3f7f6;
}
.color-5 {
color: #eff5f1;
}

/* CSS Variables */
:root {
--color-1: #a8d3e1;
 --color-2: #bed5da;
 --color-3: #d4e8e3;
 --color-4: #f3f7f6;
 --color-5: #eff5f1;
 }

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

/* Linear Gradient */
.linear-gradient {
background: linear-gradient(0.25turn, #a8d3e1, #bed5da, #d4e8e3, #f3f7f6, #eff5f1);
}
/* Radial Gradient */
.radial-gradient {
background: radial-gradient(circle, #a8d3e1, #bed5da, #d4e8e3, #f3f7f6, #eff5f1);
}

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

Frost color palette created on .