色名 · #E8A7E2
Candy Floss
Candy Flossは#E8A7E2：rgb(232 167 226)、hsl(306 59% 78%)、oklch(0.808 0.108 329.7)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Purple mean? → · Candy Floss color name →
#E8A7E2
oklch(0.808 0.108 329.7)
カラー変換
- HEX
- #e8a7e2
- RGB
- rgb(232 167 226)
- HSL
- hsl(306 59% 78%)
- HWB
- hwb(306 65% 9%)
- OKLCH
- oklch(0.808 0.108 329.7)
- OKLab
- oklab(0.808 0.093 -0.054)
- CIE Lab
- lab(76.23 31.55 -20.01)
- LCH
- lch(76.23 37.36 327.6)
- CMYK
- cmyk(0% 28% 3% 9%)
ティント · シェード · トーン
ティント
- EBB0E5
- EDB9E8
- F0C2EB
- F2CAEE
- F5D3F1
- F7DCF4
- F9E5F7
- FBEDF9
- FDF6FC
シェード
- CA91C4
- AC7BA8
- 90668C
- 745271
- 593E57
- 402C3E
- 291A27
- 130A12
- 030103
トーン
- DDA3D8
- D3A0CE
- C89CC4
- BE98BA
- B394B0
- A990A6
- 9F8C9D
- 958893
- 8A8489
カラーハーモニー
補色 +180°
- E8A7E2
Candy Floss
- 8DD49B
≈ May Apple
類似色 -30° +30°
- E8A7E2
Candy Floss
- CBB1FC
≈ Teasel Dipsacus
- FAA3BE
≈ Rogue Pink
トライアド +120° +240°
- E8A7E2
Candy Floss
- DCBD6B
≈ Pineapple Wine
- 5ED3E6
≈ Turquoise Sea
スプリットコンプリメンタリー +150° +210°
- E8A7E2
Candy Floss
- B8CB79
≈ Floral Bouquet
- 66D7C3
≈ Turquoise Twist
テトラード +90° +180° +270°
- E8A7E2
Candy Floss
- F4AF77
≈ Tacao
- 8DD49B
≈ May Apple
- 7CCAFF
≈ Bubbly Barracuda
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 1.89:1 · APCA Lc 36
Ag
AAA黒の上
WCAG 11.05:1 · APCA Lc 66
最適な文字色: #000000
WCAG 11.05:1 (AAA) · APCA Lc 66
Contrast pairs
コードスニペット
CSS
:root {
--candy-floss: #e8a7e2;
--candy-floss-rgb: 232 167 226;
--candy-floss-oklch: oklch(0.808 0.108 329.7);
}
.element {
color: var(--candy-floss);
background-color: hsl(306 59% 78%);
border-color: oklch(0.808 0.108 329.7);
}Tailwind CSS v4
@theme {
--color-candy-floss: #e8a7e2;
--color-candy-floss-50: #ffeaff;
--color-candy-floss-100: #fedbf8;
--color-candy-floss-200: #f0c4e9;
--color-candy-floss-300: #d9a3d0;
--color-candy-floss-400: #c287bd;
--color-candy-floss-500: #ae6aa8;
--color-candy-floss-600: #935a8e;
--color-candy-floss-700: #764872;
--color-candy-floss-800: #563455;
--color-candy-floss-900: #3c243c;
--color-candy-floss-950: #261225;
}SCSS
$candy-floss: #e8a7e2;
$candy-floss-rgb: 232, 167, 226;
$candy-floss-light: mix(#fff, $candy-floss, 20%);
$candy-floss-dark: mix(#000, $candy-floss, 20%);
.element {
color: $candy-floss;
box-shadow: 0 0 0 2px rgba($candy-floss, 0.35);
}