Mystic Flour カラーパレット

明るさ

彩度

暖かさ

UI Examples

Explore beautiful UI components with Mystic Flour palette

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

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

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

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

Download mystic flour color palette PNG image (landscape)
Download mystic flour color palette PNG image (square)

Mystic Flour カラーパレット CSS

/* CSS */
.color-1 {
color: #d1c7e1;
}
.color-2 {
color: #b49fcb;
}
.color-3 {
color: #9f77b1;
}
.color-4 {
color: #c5a5d5;
}
.color-5 {
color: #e5c2e0;
}

/* CSS Variables */
:root {
--color-1: #d1c7e1;
 --color-2: #b49fcb;
 --color-3: #9f77b1;
 --color-4: #c5a5d5;
 --color-5: #e5c2e0;
 }

Mystic Flour の背景のグラデーション CSS

/* Linear Gradient */
.linear-gradient {
background: linear-gradient(0.25turn, #d1c7e1, #b49fcb, #9f77b1, #c5a5d5, #e5c2e0);
}
/* Radial Gradient */
.radial-gradient {
background: radial-gradient(circle, #d1c7e1, #b49fcb, #9f77b1, #c5a5d5, #e5c2e0);
}

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

Mystic Flour color palette created on .