Love and Hate カラーパレット

明るさ

彩度

暖かさ

UI Examples

Explore beautiful UI components with Love and Hate palette

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

Love and Hate カラー パレット PNG 画像

Download love and hate color palette PNG image (landscape)
Download love and hate color palette PNG image (square)

Love and Hate カラーパレット CSS

/* CSS */
.color-1 {
color: #5c0000;
}
.color-2 {
color: #8c1717;
}
.color-3 {
color: #8a5300;
}
.color-4 {
color: #8a7c00;
}
.color-5 {
color: #8b3c3c;
}

/* CSS Variables */
:root {
--color-1: #5c0000;
 --color-2: #8c1717;
 --color-3: #8a5300;
 --color-4: #8a7c00;
 --color-5: #8b3c3c;
 }

Love and Hate の背景のグラデーション CSS

/* Linear Gradient */
.linear-gradient {
background: linear-gradient(0.25turn, #5c0000, #8c1717, #8a5300, #8a7c00, #8b3c3c);
}
/* Radial Gradient */
.radial-gradient {
background: radial-gradient(circle, #5c0000, #8c1717, #8a5300, #8a7c00, #8b3c3c);
}

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

Love and Hate color palette created on .