Cat Nap カラーパレット

明るさ

彩度

暖かさ

UI Examples

Explore beautiful UI components with Cat Nap palette

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

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

Download cat nap color palette PNG image (landscape)
Download cat nap color palette PNG image (square)

Cat Nap カラーパレット CSS

/* CSS */
.color-1 {
color: #f3e6d8;
}
.color-2 {
color: #d5c0ae;
}
.color-3 {
color: #c8a99d;
}
.color-4 {
color: #a56f7e;
}
.color-5 {
color: #7d4f6c;
}

/* CSS Variables */
:root {
--color-1: #f3e6d8;
 --color-2: #d5c0ae;
 --color-3: #c8a99d;
 --color-4: #a56f7e;
 --color-5: #7d4f6c;
 }

Cat Nap の背景のグラデーション CSS

/* Linear Gradient */
.linear-gradient {
background: linear-gradient(0.25turn, #f3e6d8, #d5c0ae, #c8a99d, #a56f7e, #7d4f6c);
}
/* Radial Gradient */
.radial-gradient {
background: radial-gradient(circle, #f3e6d8, #d5c0ae, #c8a99d, #a56f7e, #7d4f6c);
}

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

Cat Nap color palette created on .