Cor nomeada mais próxima · #DFF2E4
#DFF2E4
Cor nomeada mais próxima: Frozen Civilization
#DFF2E4 (rgb(223 242 228), hsl(136 42% 91%), oklch(0.943 0.027 153.9)) é mais próxima da cor nomeada Frozen Civilization. Veja tons claros, sombras, harmonias, contraste WCAG e APCA e código CSS, Tailwind v4 e SCSS.
#DFF2E4
oklch(0.943 0.027 153.9)
Conversões de cor
- HEX
- #dff2e4
- RGB
- rgb(223 242 228)
- HSL
- hsl(136 42% 91%)
- HWB
- hwb(136 87% 5%)
- OKLCH
- oklch(0.943 0.027 153.9)
- OKLab
- oklab(0.943 -0.025 0.012)
- CIE Lab
- lab(93.79 -8.39 4.53)
- LCH
- lch(93.79 9.53 151.7)
- CMYK
- cmyk(8% 0% 6% 5%)
Tons claros · Sombras · Tons
Tons claros
- E2F3E7
- E5F5E9
- E9F6EC
- ECF7EF
- EFF9F1
- F2FAF4
- F5FBF7
- F9FCFA
- FCFEFC
Sombras
- C2D2C6
- A5B4A9
- 8A968D
- 6F7972
- 565E58
- 3D433F
- 272B28
- 121412
- 020303
Tons
- D5E6DA
- CBDACF
- C2CEC5
- B8C3BB
- AEB7B1
- A5ACA7
- 9CA19D
- 929693
- 898B8A
Harmonias de cor
Complementar +180°
- DFF2E4
Frozen Civilization
- F8E6F4
≈ Cherry Pearl
Análoga -30° +30°
- DFF2E4
Frozen Civilization
- E8F0DC
≈ Diluted Lime
- D9F3EE
≈ Air of Mint
Tríade +120° +240°
- DFF2E4
Frozen Civilization
- E6EBFF
≈ Icy Lilac
- FEE6E0
≈ Olm Pink
Complementar dividida +150° +210°
- DFF2E4
Frozen Civilization
- F0E8FC
≈ Bright Dusk
- FDE5EA
≈ Hepatica
Tétrade +90° +180° +270°
- DFF2E4
Frozen Civilization
- DDEFFE
≈ Calcareous Sinter
- F8E6F4
≈ Cherry Pearl
- FAE9DA
≈ Poppy Crepe
Contraste e acessibilidade
Ag
FailSobre branco
WCAG 1.16:1 · APCA Lc 8
Ag
AAASobre preto
WCAG 17.95:1 · APCA Lc 96
Melhor cor de texto: #000000
WCAG 17.95:1 (AAA) · APCA Lc 96
Contrast pairs
Trechos de código
CSS
:root {
--frozen-civilization: #dff2e4;
--frozen-civilization-rgb: 223 242 228;
--frozen-civilization-oklch: oklch(0.943 0.027 153.9);
}
.element {
color: var(--frozen-civilization);
background-color: hsl(136 42% 91%);
border-color: oklch(0.943 0.027 153.9);
}Tailwind CSS v4
@theme {
--color-frozen-civilization: #dff2e4;
--color-frozen-civilization-50: #eff8f2;
--color-frozen-civilization-100: #e1ebe4;
--color-frozen-civilization-200: #cbd8cf;
--color-frozen-civilization-300: #adbcb2;
--color-frozen-civilization-400: #93a397;
--color-frozen-civilization-500: #798c7e;
--color-frozen-civilization-600: #66766b;
--color-frozen-civilization-700: #525f55;
--color-frozen-civilization-800: #3c453e;
--color-frozen-civilization-900: #29302a;
--color-frozen-civilization-950: #171c18;
}SCSS
$frozen-civilization: #dff2e4;
$frozen-civilization-rgb: 223, 242, 228;
$frozen-civilization-light: mix(#fff, $frozen-civilization, 20%);
$frozen-civilization-dark: mix(#000, $frozen-civilization, 20%);
.element {
color: $frozen-civilization;
box-shadow: 0 0 0 2px rgba($frozen-civilization, 0.35);
}