Retro Technical カラーパレット

明るさ

彩度

暖かさ

UI Examples

Explore beautiful UI components with Retro Technical palette

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

Retro Technical カラー パレット PNG 画像

Download retro technical color palette PNG image (landscape)
Download retro technical color palette PNG image (square)

Retro Technical カラーパレット CSS

/* CSS */
.color-1 {
color: #1f3a61;
}
.color-2 {
color: #497c92;
}
.color-3 {
color: #6ec1c4;
}
.color-4 {
color: #f9a64e;
}
.color-5 {
color: #e83f21;
}

/* CSS Variables */
:root {
--color-1: #1f3a61;
 --color-2: #497c92;
 --color-3: #6ec1c4;
 --color-4: #f9a64e;
 --color-5: #e83f21;
 }

Retro Technical の背景のグラデーション CSS

/* Linear Gradient */
.linear-gradient {
background: linear-gradient(0.25turn, #1f3a61, #497c92, #6ec1c4, #f9a64e, #e83f21);
}
/* Radial Gradient */
.radial-gradient {
background: radial-gradient(circle, #1f3a61, #497c92, #6ec1c4, #f9a64e, #e83f21);
}

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

Retro Technical color palette created on .