Teal Oasis カラーパレット

明るさ

彩度

暖かさ

UI Examples

Explore beautiful UI components with Teal Oasis palette

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

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

Download teal oasis color palette PNG image (landscape)
Download teal oasis color palette PNG image (square)

Teal Oasis カラーパレット CSS

/* CSS */
.color-1 {
color: #2b6c8c;
}
.color-2 {
color: #4ba0a0;
}
.color-3 {
color: #6fc8b6;
}
.color-4 {
color: #a9e0d2;
}
.color-5 {
color: #d2f4e9;
}

/* CSS Variables */
:root {
--color-1: #2b6c8c;
 --color-2: #4ba0a0;
 --color-3: #6fc8b6;
 --color-4: #a9e0d2;
 --color-5: #d2f4e9;
 }

Teal Oasis の背景のグラデーション CSS

/* Linear Gradient */
.linear-gradient {
background: linear-gradient(0.25turn, #2b6c8c, #4ba0a0, #6fc8b6, #a9e0d2, #d2f4e9);
}
/* Radial Gradient */
.radial-gradient {
background: radial-gradient(circle, #2b6c8c, #4ba0a0, #6fc8b6, #a9e0d2, #d2f4e9);
}

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

Teal Oasis color palette created on .