April O'Neil カラーパレット

明るさ

彩度

暖かさ

UI Examples

Explore beautiful UI components with April O'Neil palette

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

April O'Neil カラー パレット PNG 画像

Download april o'neil color palette PNG image (landscape)
Download april o'neil color palette PNG image (square)

April O'Neil カラーパレット CSS

/* CSS */
.color-1 {
color: #706657;
}
.color-2 {
color: #707057;
}
.color-3 {
color: #385d80;
}
.color-4 {
color: #2c3e54;
}
.color-5 {
color: #493641;
}

/* CSS Variables */
:root {
--color-1: #706657;
 --color-2: #707057;
 --color-3: #385d80;
 --color-4: #2c3e54;
 --color-5: #493641;
 }

April O'Neil の背景のグラデーション CSS

/* Linear Gradient */
.linear-gradient {
background: linear-gradient(0.25turn, #706657, #707057, #385d80, #2c3e54, #493641);
}
/* Radial Gradient */
.radial-gradient {
background: radial-gradient(circle, #706657, #707057, #385d80, #2c3e54, #493641);
}

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

April O'Neil color palette created on .