Named color · #C7F1FF
Heaven’s Gate
Heaven’s Gate is #C7F1FF: rgb(199 241 255), hsl(195 100% 89%), oklch(0.933 0.047 220). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Cyan mean? → · Heaven’s Gate color name →
#C7F1FF
oklch(0.933 0.047 220)
Color conversions
- HEX
- #c7f1ff
- RGB
- rgb(199 241 255)
- HSL
- hsl(195 100% 89%)
- HWB
- hwb(195 78% 0%)
- OKLCH
- oklch(0.933 0.047 220)
- OKLab
- oklab(0.933 -0.036 -0.03)
- CIE Lab
- lab(92.5 -11.78 -11.5)
- LCH
- lch(92.5 16.46 224.3)
- CMYK
- cmyk(22% 5% 0% 0%)
Tints · Shades · Tones
Tints
- CDF2FF
- D3F4FF
- D8F5FF
- DEF7FF
- E3F8FF
- E9FAFF
- EFFBFF
- F4FCFF
- FAFEFF
Shades
- ADD2DE
- 93B3BE
- 7A959E
- 627980
- 4C5D63
- 364348
- 212B2E
- 0E1416
- 020303
Tones
- C0E5F2
- B9D9E4
- B2CED7
- AAC2CA
- A3B7BE
- 9CACB1
- 95A1A4
- 8E9698
- 878B8C
Color harmonies
Complementary +180°
- C7F1FF
Heaven’s Gate
- FFE2D7
≈ Tranquil Peach
Analogous -30° +30°
- C7F1FF
Heaven’s Gate
- C6F4F0
≈ Shallow End
- D9EBFF
≈ Cloudless
Triadic +120° +240°
- C7F1FF
Heaven’s Gate
- FFDEF3
≈ So This Is Love
- F0EAC6
≈ Natural Light
Split-complementary +150° +210°
- C7F1FF
Heaven’s Gate
- FFE0E3
≈ Pink Pleasure
- FEE4C7
≈ Satin Blush
Tetradic +90° +180° +270°
- C7F1FF
Heaven’s Gate
- F2E1FF
≈ Lavender Savour
- FFE2D7
≈ Tranquil Peach
- DEF0CF
≈ Tzatziki Green
Contrast & accessibility
Ag
FailOn white
WCAG 1.20:1 · APCA Lc 10
Ag
AAAOn black
WCAG 17.45:1 · APCA Lc 94
Best text color: #000000
WCAG 17.45:1 (AAA) · APCA Lc 94
Contrast pairs
Code snippets
CSS
:root {
--heaven-s-gate: #c7f1ff;
--heaven-s-gate-rgb: 199 241 255;
--heaven-s-gate-oklch: oklch(0.933 0.047 220);
}
.element {
color: var(--heaven-s-gate);
background-color: hsl(195 100% 89%);
border-color: oklch(0.933 0.047 220);
}Tailwind CSS v4
@theme {
--color-heaven-s-gate: #c7f1ff;
--color-heaven-s-gate-50: #e7f9ff;
--color-heaven-s-gate-100: #d8ecf3;
--color-heaven-s-gate-200: #bfd9e3;
--color-heaven-s-gate-300: #9ebdc9;
--color-heaven-s-gate-400: #80a5b2;
--color-heaven-s-gate-500: #628e9c;
--color-heaven-s-gate-600: #547884;
--color-heaven-s-gate-700: #43606a;
--color-heaven-s-gate-800: #2f474d;
--color-heaven-s-gate-900: #203136;
--color-heaven-s-gate-950: #101d21;
}SCSS
$heaven-s-gate: #c7f1ff;
$heaven-s-gate-rgb: 199, 241, 255;
$heaven-s-gate-light: mix(#fff, $heaven-s-gate, 20%);
$heaven-s-gate-dark: mix(#000, $heaven-s-gate, 20%);
.element {
color: $heaven-s-gate;
box-shadow: 0 0 0 2px rgba($heaven-s-gate, 0.35);
}