Orange Injection カラーパレット

明るさ

彩度

暖かさ

UI Examples

Explore beautiful UI components with Orange Injection palette

カラーインスピレーション

実際のデザインでこのカラーパレットを紹介する画像

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

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

Download orange injection color palette PNG image (landscape)
Download orange injection color palette PNG image (square)

Orange Injection カラーパレット CSS

/* CSS */
.color-1 {
color: #cc8775;
}
.color-2 {
color: #cc9271;
}
.color-3 {
color: #c89f6a;
}
.color-4 {
color: #c8ac6a;
}
.color-5 {
color: #d4c18c;
}

/* CSS Variables */
:root {
--color-1: #cc8775;
 --color-2: #cc9271;
 --color-3: #c89f6a;
 --color-4: #c8ac6a;
 --color-5: #d4c18c;
 }

Orange Injection の背景のグラデーション CSS

/* Linear Gradient */
.linear-gradient {
background: linear-gradient(0.25turn, #cc8775, #cc9271, #c89f6a, #c8ac6a, #d4c18c);
}
/* Radial Gradient */
.radial-gradient {
background: radial-gradient(circle, #cc8775, #cc9271, #c89f6a, #c8ac6a, #d4c18c);
}

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

Orange Injection color palette created on .