Кристалл カラーパレット

明るさ

彩度

暖かさ

UI Examples

Explore beautiful UI components with Кристалл palette

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

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

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

Кристалл カラーパレット (PNG) をダウンロード

Download кристалл color palette PNG image (landscape)
Download кристалл color palette PNG image (square)

Кристалл カラーパレット CSS

/* CSS */
.color-1 {
color: #a8d3e1;
}
.color-2 {
color: #b9e4e0;
}
.color-3 {
color: #f1f6f9;
}
.color-4 {
color: #ffb3ba;
}
.color-5 {
color: #ff667d;
}

/* CSS Variables */
:root {
--color-1: #a8d3e1;
 --color-2: #b9e4e0;
 --color-3: #f1f6f9;
 --color-4: #ffb3ba;
 --color-5: #ff667d;
 }

Кристалл の背景のグラデーション CSS

/* Linear Gradient */
.linear-gradient {
background: linear-gradient(0.25turn, #a8d3e1, #b9e4e0, #f1f6f9, #ffb3ba, #ff667d);
}
/* Radial Gradient */
.radial-gradient {
background: radial-gradient(circle, #a8d3e1, #b9e4e0, #f1f6f9, #ffb3ba, #ff667d);
}

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

Кристалл color palette created on .