Tropical Twilight カラーパレット

明るさ

彩度

暖かさ

UI Examples

Explore beautiful UI components with Tropical Twilight palette

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

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

Download tropical twilight color palette PNG image (landscape)
Download tropical twilight color palette PNG image (square)

Tropical Twilight カラーパレット CSS

/* CSS */
.color-1 {
color: #ff3d9b;
}
.color-2 {
color: #3b9b7b;
}
.color-3 {
color: #a2b4b4;
}
.color-4 {
color: #1c3f73;
}
.color-5 {
color: #eab8e4;
}

/* CSS Variables */
:root {
--color-1: #ff3d9b;
 --color-2: #3b9b7b;
 --color-3: #a2b4b4;
 --color-4: #1c3f73;
 --color-5: #eab8e4;
 }

Tropical Twilight の背景のグラデーション CSS

/* Linear Gradient */
.linear-gradient {
background: linear-gradient(0.25turn, #ff3d9b, #3b9b7b, #a2b4b4, #1c3f73, #eab8e4);
}
/* Radial Gradient */
.radial-gradient {
background: radial-gradient(circle, #ff3d9b, #3b9b7b, #a2b4b4, #1c3f73, #eab8e4);
}

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

Tropical Twilight color palette created on .