色名 · #EE66EE
Pink Ping
Pink Pingは#EE66EE：rgb(238 102 238)、hsl(300 80% 67%)、oklch(0.726 0.228 327.6)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Purple mean? → · Pink Ping color name →
#EE66EE
oklch(0.726 0.228 327.6)
カラー変換
- HEX
- #ee66ee
- RGB
- rgb(238 102 238)
- HSL
- hsl(300 80% 67%)
- HWB
- hwb(300 40% 7%)
- OKLCH
- oklch(0.726 0.228 327.6)
- OKLab
- oklab(0.726 0.193 -0.122)
- CIE Lab
- lab(64.75 65.68 -44.09)
- LCH
- lch(64.75 79.11 326.1)
- CMYK
- cmyk(0% 57% 0% 7%)
ティント · シェード · トーン
ティント
- F178F0
- F489F3
- F799F5
- F9A8F7
- FBB7F9
- FCC6FA
- FED4FC
- FEE3FD
- FFF1FE
シェード
- CF58CF
- B14AB1
- 933C93
- 772F77
- 5C235C
- 421742
- 2A0C2A
- 140414
- 030003
トーン
- E36BE3
- D970D8
- CE73CD
- C376C2
- B879B7
- AE7BAC
- A27DA1
- 977E96
- 8C7F8B
カラーハーモニー
補色 +180°
- EE66EE
Pink Ping
- 00C84E
≈ Alienated
類似色 -30° +30°
- EE66EE
Pink Ping
- B38DFF
≈ Lilac Geode
- FF6BA7
≈ Yíng Guāng Sè Pink
トライアド +120° +240°
- EE66EE
Pink Ping
- CE9F00
≈ Lepton Gold
- 00BCCF
≈ Holiday Blue
スプリットコンプリメンタリー +150° +210°
- EE66EE
Pink Ping
- 9FB300
≈ Citrus
- 00C1A6
≈ Turquoise
テトラード +90° +180° +270°
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 2.70:1 · APCA Lc 52
Ag
AAA黒の上
WCAG 7.77:1 · APCA Lc 50
最適な文字色: #000000
WCAG 7.77:1 (AAA) · APCA Lc 50
Contrast pairs
コードスニペット
CSS
:root {
--pink-ping: #ee66ee;
--pink-ping-rgb: 238 102 238;
--pink-ping-oklch: oklch(0.726 0.228 327.6);
}
.element {
color: var(--pink-ping);
background-color: hsl(300 80% 67%);
border-color: oklch(0.726 0.228 327.6);
}Tailwind CSS v4
@theme {
--color-pink-ping: #ee66ee;
--color-pink-ping-50: #ffdeff;
--color-pink-ping-100: #ffccff;
--color-pink-ping-200: #ffafff;
--color-pink-ping-300: #f688ef;
--color-pink-ping-400: #e262e2;
--color-pink-ping-500: #cf32d1;
--color-pink-ping-600: #af2eb0;
--color-pink-ping-700: #8d258e;
--color-pink-ping-800: #67196c;
--color-pink-ping-900: #49114c;
--color-pink-ping-950: #2f0232;
}SCSS
$pink-ping: #ee66ee;
$pink-ping-rgb: 238, 102, 238;
$pink-ping-light: mix(#fff, $pink-ping, 20%);
$pink-ping-dark: mix(#000, $pink-ping, 20%);
.element {
color: $pink-ping;
box-shadow: 0 0 0 2px rgba($pink-ping, 0.35);
}