色名 · #E5CFDE
Summer Clover
Summer Cloverは#E5CFDE：rgb(229 207 222)、hsl(319 30% 85%)、oklch(0.877 0.031 337.3)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Gray mean? → · Summer Clover color name →
#E5CFDE
oklch(0.877 0.031 337.3)
カラー変換
- HEX
- #e5cfde
- RGB
- rgb(229 207 222)
- HSL
- hsl(319 30% 85%)
- HWB
- hwb(319 81% 10%)
- OKLCH
- oklch(0.877 0.031 337.3)
- OKLab
- oklab(0.877 0.029 -0.012)
- CIE Lab
- lab(85.3 9.83 -4.51)
- LCH
- lch(85.3 10.82 335.4)
- CMYK
- cmyk(0% 10% 3% 10%)
ティント · シェード · トーン
ティント
- E8D4E1
- EAD8E5
- EDDDE8
- EFE2EB
- F2E7EE
- F5ECF2
- F7F0F5
- FAF5F8
- FCFAFC
シェード
- C7B4C1
- AA99A5
- 8E7F89
- 72676F
- 584F55
- 3F383D
- 282326
- 121012
- 030202
トーン
- DAC7D4
- D0BFCA
- C6B7C1
- BBAFB7
- B1A7AE
- A79FA4
- 9D979B
- 938F92
- 8A8889
カラーハーモニー
補色 +180°
- E5CFDE
Summer Clover
- C6DDCE
≈ Green Wash
類似色 -30° +30°
- E5CFDE
Summer Clover
- DCD1E7
≈ Shimmering Sky
- EACED3
≈ Pink Pail
トライアド +120° +240°
- E5CFDE
Summer Clover
- DCD7C0
≈ Palm Heart Cream
- C0DCE4
≈ Washing Powder White
スプリットコンプリメンタリー +150° +210°
- E5CFDE
Summer Clover
- D1DBC5
≈ Pale Moss Green
- C0DEDA
≈ Antiguan
テトラード +90° +180° +270°
- E5CFDE
Summer Clover
- E5D3C1
≈ Simply Subtle Pink
- C6DDCE
≈ Green Wash
- C7D9EB
≈ Arctic Rain
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 1.46:1 · APCA Lc 22
Ag
AAA黒の上
WCAG 14.31:1 · APCA Lc 81
最適な文字色: #000000
WCAG 14.31:1 (AAA) · APCA Lc 81
Contrast pairs
コードスニペット
CSS
:root {
--summer-clover: #e5cfde;
--summer-clover-rgb: 229 207 222;
--summer-clover-oklch: oklch(0.877 0.031 337.3);
}
.element {
color: var(--summer-clover);
background-color: hsl(319 30% 85%);
border-color: oklch(0.877 0.031 337.3);
}Tailwind CSS v4
@theme {
--color-summer-clover: #e5cfde;
--color-summer-clover-50: #fcf2f8;
--color-summer-clover-100: #f0e4eb;
--color-summer-clover-200: #decfd9;
--color-summer-clover-300: #c3b1bd;
--color-summer-clover-400: #ab98a5;
--color-summer-clover-500: #957f8e;
--color-summer-clover-600: #7e6b78;
--color-summer-clover-700: #655660;
--color-summer-clover-800: #4a3e47;
--color-summer-clover-900: #332b31;
--color-summer-clover-950: #1f181d;
}SCSS
$summer-clover: #e5cfde;
$summer-clover-rgb: 229, 207, 222;
$summer-clover-light: mix(#fff, $summer-clover, 20%);
$summer-clover-dark: mix(#000, $summer-clover, 20%);
.element {
color: $summer-clover;
box-shadow: 0 0 0 2px rgba($summer-clover, 0.35);
}