Layla カラーパレット

明るさ

彩度

暖かさ

UI Examples

Explore beautiful UI components with Layla palette

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

Layla カラー パレット PNG 画像

Download layla color palette PNG image (landscape)
Download layla color palette PNG image (square)

Layla カラーパレット CSS

/* CSS */
.color-1 {
color: #f5ae7f;
}
.color-2 {
color: #f5b67f;
}
.color-3 {
color: #f1ae6f;
}
.color-4 {
color: #dda883;
}
.color-5 {
color: #dfa38b;
}

/* CSS Variables */
:root {
--color-1: #f5ae7f;
 --color-2: #f5b67f;
 --color-3: #f1ae6f;
 --color-4: #dda883;
 --color-5: #dfa38b;
 }

Layla の背景のグラデーション CSS

/* Linear Gradient */
.linear-gradient {
background: linear-gradient(0.25turn, #f5ae7f, #f5b67f, #f1ae6f, #dda883, #dfa38b);
}
/* Radial Gradient */
.radial-gradient {
background: radial-gradient(circle, #f5ae7f, #f5b67f, #f1ae6f, #dda883, #dfa38b);
}

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

Layla color palette created on .