Leviathan カラーパレット

明るさ

彩度

暖かさ

UI Examples

Explore beautiful UI components with Leviathan palette

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

Leviathan カラー パレット PNG 画像

Download leviathan color palette PNG image (landscape)
Download leviathan color palette PNG image (square)

Leviathan カラーパレット CSS

/* CSS */
.color-1 {
color: #1f3a61;
}
.color-2 {
color: #3b6a8c;
}
.color-3 {
color: #8db4c8;
}
.color-4 {
color: #f9c84e;
}
.color-5 {
color: #e77e23;
}

/* CSS Variables */
:root {
--color-1: #1f3a61;
 --color-2: #3b6a8c;
 --color-3: #8db4c8;
 --color-4: #f9c84e;
 --color-5: #e77e23;
 }

Leviathan の背景のグラデーション CSS

/* Linear Gradient */
.linear-gradient {
background: linear-gradient(0.25turn, #1f3a61, #3b6a8c, #8db4c8, #f9c84e, #e77e23);
}
/* Radial Gradient */
.radial-gradient {
background: radial-gradient(circle, #1f3a61, #3b6a8c, #8db4c8, #f9c84e, #e77e23);
}

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

Leviathan color palette created on .