Ayame Hayashi カラーパレット

明るさ

彩度

暖かさ

UI Examples

Explore beautiful UI components with Ayame Hayashi palette

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

Ayame Hayashi カラー パレット PNG 画像

Download ayame hayashi color palette PNG image (landscape)
Download ayame hayashi color palette PNG image (square)

Ayame Hayashi カラーパレット CSS

/* CSS */
.color-1 {
color: #f2a1ae;
}
.color-2 {
color: #e06c8f;
}
.color-3 {
color: #b75c8d;
}
.color-4 {
color: #7b5a96;
}
.color-5 {
color: #5b7a9f;
}

/* CSS Variables */
:root {
--color-1: #f2a1ae;
 --color-2: #e06c8f;
 --color-3: #b75c8d;
 --color-4: #7b5a96;
 --color-5: #5b7a9f;
 }

Ayame Hayashi の背景のグラデーション CSS

/* Linear Gradient */
.linear-gradient {
background: linear-gradient(0.25turn, #f2a1ae, #e06c8f, #b75c8d, #7b5a96, #5b7a9f);
}
/* Radial Gradient */
.radial-gradient {
background: radial-gradient(circle, #f2a1ae, #e06c8f, #b75c8d, #7b5a96, #5b7a9f);
}

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

Ayame Hayashi color palette created on .