Blue Lagoon カラーパレット

明るさ

彩度

暖かさ

UI Examples

Explore beautiful UI components with Blue Lagoon palette

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

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

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

Blue Lagoon カラーパレット CSS

/* CSS */
.color-1 {
color: #017b89;
}
.color-2 {
color: #00999e;
}
.color-3 {
color: #00b3aa;
}
.color-4 {
color: #00d1c7;
}
.color-5 {
color: #00e0d5;
}

/* CSS Variables */
:root {
--color-1: #017b89;
 --color-2: #00999e;
 --color-3: #00b3aa;
 --color-4: #00d1c7;
 --color-5: #00e0d5;
 }

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

/* Linear Gradient */
.linear-gradient {
background: linear-gradient(0.25turn, #017b89, #00999e, #00b3aa, #00d1c7, #00e0d5);
}
/* Radial Gradient */
.radial-gradient {
background: radial-gradient(circle, #017b89, #00999e, #00b3aa, #00d1c7, #00e0d5);
}

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

Blue Lagoon color palette created on .