Cor nomeada · #CFEEE1
Jewel White
Jewel White é #CFEEE1: rgb(207 238 225), hsl(155 48% 87%), oklch(0.923 0.037 168.3). Veja tons claros, sombras, harmonias, contraste WCAG e APCA e código CSS, Tailwind v4 e SCSS.
What does Teal mean? → · Jewel White color name →
#CFEEE1
oklch(0.923 0.037 168.3)
Conversões de cor
- HEX
- #cfeee1
- RGB
- rgb(207 238 225)
- HSL
- hsl(155 48% 87%)
- HWB
- hwb(155 81% 7%)
- OKLCH
- oklch(0.923 0.037 168.3)
- OKLab
- oklab(0.923 -0.036 0.007)
- CIE Lab
- lab(91.57 -12.35 2.72)
- LCH
- lch(91.57 12.65 167.6)
- CMYK
- cmyk(13% 0% 5% 7%)
Tons claros · Sombras · Tons
Tons claros
- D4F0E4
- D9F1E7
- DEF3EA
- E2F5ED
- E7F7F0
- ECF8F3
- F1FAF6
- F5FCF9
- FAFDFC
Sombras
- B4CFC4
- 99B1A7
- 7F938B
- 677770
- 4F5C56
- 38423E
- 232A27
- 101412
- 020302
Tons
- C7E2D7
- BFD7CD
- B7CCC3
- AFC1B9
- A7B5AF
- 9FABA6
- 97A09C
- 8F9593
- 888A89
Harmonias de cor
Complementar +180°
- CFEEE1
Jewel White
- FADCEA
≈ Cherry Flower
Análoga -30° +30°
- CFEEE1
Jewel White
- DAECD4
≈ Graceful Mint
- CAEEEF
≈ Princess Blue Feather
Tríade +120° +240°
- CFEEE1
Jewel White
- E4E2FE
≈ Stoic White
- FBDFD1
≈ Elizabeth Rose
Complementar dividida +150° +210°
- CFEEE1
Jewel White
- F0DEF6
≈ Grape Taffy
- FEDCDC
≈ Aquarelle Red
Tétrade +90° +180° +270°
- CFEEE1
Jewel White
- D7E7FF
≈ Veiling Waterfalls
- FADCEA
≈ Cherry Flower
- F3E3CB
≈ Welcome White
Contraste e acessibilidade
Ag
FailSobre branco
WCAG 1.23:1 · APCA Lc 12
Ag
AAASobre preto
WCAG 16.97:1 · APCA Lc 92
Melhor cor de texto: #000000
WCAG 16.97:1 (AAA) · APCA Lc 92
Contrast pairs
Trechos de código
CSS
:root {
--jewel-white: #cfeee1;
--jewel-white-rgb: 207 238 225;
--jewel-white-oklch: oklch(0.923 0.037 168.3);
}
.element {
color: var(--jewel-white);
background-color: hsl(155 48% 87%);
border-color: oklch(0.923 0.037 168.3);
}Tailwind CSS v4
@theme {
--color-jewel-white: #cfeee1;
--color-jewel-white-50: #ebf9f3;
--color-jewel-white-100: #ddece6;
--color-jewel-white-200: #c6dad2;
--color-jewel-white-300: #a6beb5;
--color-jewel-white-400: #8aa69a;
--color-jewel-white-500: #6f8e82;
--color-jewel-white-600: #5e786e;
--color-jewel-white-700: #4b6058;
--color-jewel-white-800: #36473f;
--color-jewel-white-900: #25312c;
--color-jewel-white-950: #141d19;
}SCSS
$jewel-white: #cfeee1;
$jewel-white-rgb: 207, 238, 225;
$jewel-white-light: mix(#fff, $jewel-white, 20%);
$jewel-white-dark: mix(#000, $jewel-white, 20%);
.element {
color: $jewel-white;
box-shadow: 0 0 0 2px rgba($jewel-white, 0.35);
}