Cor nomeada mais próxima · #DCEDF7
#DCEDF7
Cor nomeada mais próxima: Celestial Cathedral
#DCEDF7 (rgb(220 237 247), hsl(202 63% 92%), oklch(0.936 0.023 233.4)) é mais próxima da cor nomeada Celestial Cathedral. Veja tons claros, sombras, harmonias, contraste WCAG e APCA e código CSS, Tailwind v4 e SCSS.
#DCEDF7
oklch(0.936 0.023 233.4)
Conversões de cor
- HEX
- #dcedf7
- RGB
- rgb(220 237 247)
- HSL
- hsl(202 63% 92%)
- HWB
- hwb(202 86% 3%)
- OKLCH
- oklch(0.936 0.023 233.4)
- OKLab
- oklab(0.936 -0.013 -0.018)
- CIE Lab
- lab(92.7 -4.37 -6.88)
- LCH
- lch(92.7 8.15 237.5)
- CMYK
- cmyk(11% 4% 0% 3%)
Tons claros · Sombras · Tons
Tons claros
- E0EFF8
- E3F1F9
- E6F2F9
- EAF4FA
- EDF6FB
- F1F8FC
- F4FAFD
- F8FBFD
- FBFDFE
Sombras
- BFCED7
- A3B0B7
- 889399
- 6E777C
- 545C60
- 3C4245
- 262A2C
- 111415
- 020303
Tons
- D2E2EA
- C9D6DE
- C0CBD2
- B6C0C6
- ADB5BA
- A4AAAE
- 9B9FA2
- 929597
- 898A8B
Harmonias de cor
Complementar +180°
- DCEDF7
Celestial Cathedral
- F7E6DC
≈ Coast Cream
Análoga -30° +30°
- DCEDF7
Celestial Cathedral
- DAEFF1
≈ White Glaze
- E2EAFA
≈ Husky
Tríade +120° +240°
- DCEDF7
Celestial Cathedral
- F7E4EB
≈ Pink Tutu
- EAECDB
≈ Colleen Green
Complementar dividida +150° +210°
- DCEDF7
Celestial Cathedral
- F9E5E3
≈ Tutu
- F1E9D9
≈ Horchata
Tétrade +90° +180° +270°
- DCEDF7
Celestial Cathedral
- F2E5F3
≈ Holographic Lavender
- F7E6DC
≈ Coast Cream
- E2EEE1
≈ Soothing Vapour
Contraste e acessibilidade
Ag
FailSobre branco
WCAG 1.20:1 · APCA Lc 10
Ag
AAASobre preto
WCAG 17.49:1 · APCA Lc 94
Melhor cor de texto: #000000
WCAG 17.49:1 (AAA) · APCA Lc 94
Contrast pairs
Trechos de código
CSS
:root {
--celestial-cathedral: #dcedf7;
--celestial-cathedral-rgb: 220 237 247;
--celestial-cathedral-oklch: oklch(0.936 0.023 233.4);
}
.element {
color: var(--celestial-cathedral);
background-color: hsl(202 63% 92%);
border-color: oklch(0.936 0.023 233.4);
}Tailwind CSS v4
@theme {
--color-celestial-cathedral: #dcedf7;
--color-celestial-cathedral-50: #eff6fb;
--color-celestial-cathedral-100: #e1e9ee;
--color-celestial-cathedral-200: #cbd6dd;
--color-celestial-cathedral-300: #adbac2;
--color-celestial-cathedral-400: #92a1aa;
--color-celestial-cathedral-500: #788993;
--color-celestial-cathedral-600: #66747c;
--color-celestial-cathedral-700: #515d64;
--color-celestial-cathedral-800: #3b4449;
--color-celestial-cathedral-900: #282f33;
--color-celestial-cathedral-950: #161b1e;
}SCSS
$celestial-cathedral: #dcedf7;
$celestial-cathedral-rgb: 220, 237, 247;
$celestial-cathedral-light: mix(#fff, $celestial-cathedral, 20%);
$celestial-cathedral-dark: mix(#000, $celestial-cathedral, 20%);
.element {
color: $celestial-cathedral;
box-shadow: 0 0 0 2px rgba($celestial-cathedral, 0.35);
}