Coral Friendship カラーパレット

明るさ

彩度

暖かさ

UI Examples

Explore beautiful UI components with Coral Friendship palette

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

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

Download coral friendship color palette PNG image (landscape)
Download coral friendship color palette PNG image (square)

Coral Friendship カラーパレット CSS

/* CSS */
.color-1 {
color: #ffc2a3;
}
.color-2 {
color: #ff6e61;
}
.color-3 {
color: #c74938;
}
.color-4 {
color: #3e3c8b;
}
.color-5 {
color: #a4e0d0;
}

/* CSS Variables */
:root {
--color-1: #ffc2a3;
 --color-2: #ff6e61;
 --color-3: #c74938;
 --color-4: #3e3c8b;
 --color-5: #a4e0d0;
 }

Coral Friendship の背景のグラデーション CSS

/* Linear Gradient */
.linear-gradient {
background: linear-gradient(0.25turn, #ffc2a3, #ff6e61, #c74938, #3e3c8b, #a4e0d0);
}
/* Radial Gradient */
.radial-gradient {
background: radial-gradient(circle, #ffc2a3, #ff6e61, #c74938, #3e3c8b, #a4e0d0);
}

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

Coral Friendship color palette created on .