色名 · #FF66EE
Vaporwave
Vaporwaveは#FF66EE：rgb(255 102 238)、hsl(307 100% 70%)、oklch(0.748 0.238 332.3)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Pink mean? → · Vaporwave color name →
#FF66EE
oklch(0.748 0.238 332.3)
カラー変換
- HEX
- #ff66ee
- RGB
- rgb(255 102 238)
- HSL
- hsl(307 100% 70%)
- HWB
- hwb(307 40% 0%)
- OKLCH
- oklch(0.748 0.238 332.3)
- OKLab
- oklab(0.748 0.211 -0.111)
- CIE Lab
- lab(67.25 70.3 -39.98)
- LCH
- lch(67.25 80.88 330.4)
- CMYK
- cmyk(0% 60% 7% 0%)
ティント · シェード · トーン
ティント
- FF79F0
- FF8AF2
- FF9AF5
- FFA9F6
- FFB8F8
- FFC7FA
- FFD5FB
- FFE3FD
- FFF1FE
シェード
- DE58CF
- BE4AB1
- 9E3C93
- 802F77
- 63235C
- 481742
- 2E0C2A
- 160414
- 030003
トーン
- F36CE3
- E670D8
- DA74CD
- CE77C2
- C17AB7
- B57CAC
- A87EA1
- 9B7F96
- 8E808B
カラーハーモニー
補色 +180°
- FF66EE
Vaporwave
- 00CF6C
≈ Underwater Fern
類似色 -30° +30°
- FF66EE
Vaporwave
- C193FF
≈ Liliac
- FF7CA5
≈ Pink Makeup
トライアド +120° +240°
- FF66EE
Vaporwave
- D0A900
≈ Prehnite Yellow
- 00C2DD
≈ Caribbean Blue
スプリットコンプリメンタリー +150° +210°
- FF66EE
Vaporwave
- 9ABE00
≈ Gameboy Light
- 00C8B4
≈ Amazonite
テトラード +90° +180° +270°
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 2.50:1 · APCA Lc 48
Ag
AAA黒の上
WCAG 8.38:1 · APCA Lc 54
最適な文字色: #000000
WCAG 8.38:1 (AAA) · APCA Lc 54
Contrast pairs
コードスニペット
CSS
:root {
--vaporwave: #ff66ee;
--vaporwave-rgb: 255 102 238;
--vaporwave-oklch: oklch(0.748 0.238 332.3);
}
.element {
color: var(--vaporwave);
background-color: hsl(307 100% 70%);
border-color: oklch(0.748 0.238 332.3);
}Tailwind CSS v4
@theme {
--color-vaporwave: #ff66ee;
--color-vaporwave-50: #ffdcff;
--color-vaporwave-100: #ffcaff;
--color-vaporwave-200: #ffacfe;
--color-vaporwave-300: #fe83e8;
--color-vaporwave-400: #ea5bdb;
--color-vaporwave-500: #d823c9;
--color-vaporwave-600: #b722aa;
--color-vaporwave-700: #931c88;
--color-vaporwave-800: #6c1368;
--color-vaporwave-900: #4c0c49;
--color-vaporwave-950: #320030;
}SCSS
$vaporwave: #ff66ee;
$vaporwave-rgb: 255, 102, 238;
$vaporwave-light: mix(#fff, $vaporwave, 20%);
$vaporwave-dark: mix(#000, $vaporwave, 20%);
.element {
color: $vaporwave;
box-shadow: 0 0 0 2px rgba($vaporwave, 0.35);
}