Blue Stone カラーパレット

明るさ

彩度

暖かさ

UI Examples

Explore beautiful UI components with Blue Stone palette

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

Blue Stone カラー パレット PNG 画像

Download blue stone color palette PNG image (landscape)
Download blue stone color palette PNG image (square)

Blue Stone カラーパレット CSS

/* CSS */
.color-1 {
color: #015e60;
}
.color-2 {
color: #2a777a;
}
.color-3 {
color: #4da6a8;
}
.color-4 {
color: #80d6d4;
}
.color-5 {
color: #a2f1ee;
}

/* CSS Variables */
:root {
--color-1: #015e60;
 --color-2: #2a777a;
 --color-3: #4da6a8;
 --color-4: #80d6d4;
 --color-5: #a2f1ee;
 }

Blue Stone の背景のグラデーション CSS

/* Linear Gradient */
.linear-gradient {
background: linear-gradient(0.25turn, #015e60, #2a777a, #4da6a8, #80d6d4, #a2f1ee);
}
/* Radial Gradient */
.radial-gradient {
background: radial-gradient(circle, #015e60, #2a777a, #4da6a8, #80d6d4, #a2f1ee);
}

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

Blue Stone color palette created on .