Cor nomeada mais próxima · #C4F9F9
#C4F9F9
Cor nomeada mais próxima: Friendly Frost
#C4F9F9 (rgb(196 249 249), hsl(180 82% 87%), oklch(0.946 0.054 196.3)) é mais próxima da cor nomeada Friendly Frost. Veja tons claros, sombras, harmonias, contraste WCAG e APCA e código CSS, Tailwind v4 e SCSS.
#C4F9F9
oklch(0.946 0.054 196.3)
Conversões de cor
- HEX
- #c4f9f9
- RGB
- rgb(196 249 249)
- HSL
- hsl(180 82% 87%)
- HWB
- hwb(180 77% 2%)
- OKLCH
- oklch(0.946 0.054 196.3)
- OKLab
- oklab(0.946 -0.051 -0.015)
- CIE Lab
- lab(94.28 -17.37 -5.82)
- LCH
- lch(94.28 18.32 198.5)
- CMYK
- cmyk(21% 0% 0% 2%)
Tons claros · Sombras · Tons
Tons claros
- CAFAFA
- D0FAFA
- D7FBFB
- DCFCFB
- E2FCFC
- E8FDFD
- EEFDFD
- F4FEFE
- F9FEFE
Sombras
- AAD9D9
- 91B9B9
- 789A9A
- 617D7D
- 4A6161
- 354646
- 212C2C
- 0E1515
- 020303
Tons
- BDECEC
- B7E0E0
- B0D3D3
- A9C7C7
- A2BBBB
- 9BAFAF
- 95A3A3
- 8E9797
- 878B8B
Harmonias de cor
Complementar +180°
- C4F9F9
Friendly Frost
- FFE6E7
≈ Vanilla Strawberry
Análoga -30° +30°
- C4F9F9
Friendly Frost
- CCF9E5
≈ Cactus Water
- D6F2FF
≈ Water
Tríade +120° +240°
- C4F9F9
Friendly Frost
- F8E6FF
≈ Soft Lavender
- FFEACC
≈ Blanched Almond
Complementar dividida +150° +210°
- C4F9F9
Friendly Frost
- FFE5F2
≈ Cherubic
- FFE8DD
≈ Chablis
Tétrade +90° +180° +270°
- C4F9F9
Friendly Frost
- EBEBFF
≈ Placebo Purple
- FFE6E7
≈ Vanilla Strawberry
- F1F0C7
≈ Spring Sun
Contraste e acessibilidade
Ag
FailSobre branco
WCAG 1.14:1 · APCA Lc 0
Ag
AAASobre preto
WCAG 18.26:1 · APCA Lc 97
Melhor cor de texto: #000000
WCAG 18.26:1 (AAA) · APCA Lc 97
Contrast pairs
Trechos de código
CSS
:root {
--friendly-frost: #c4f9f9;
--friendly-frost-rgb: 196 249 249;
--friendly-frost-oklch: oklch(0.946 0.054 196.3);
}
.element {
color: var(--friendly-frost);
background-color: hsl(180 82% 87%);
border-color: oklch(0.946 0.054 196.3);
}Tailwind CSS v4
@theme {
--color-friendly-frost: #c4f9f9;
--color-friendly-frost-50: #e4fafb;
--color-friendly-frost-100: #d4eeee;
--color-friendly-frost-200: #bbdcdd;
--color-friendly-frost-300: #98c0c1;
--color-friendly-frost-400: #79a9a9;
--color-friendly-frost-500: #5a9292;
--color-friendly-frost-600: #4c7b7b;
--color-friendly-frost-700: #3d6363;
--color-friendly-frost-800: #2b4848;
--color-friendly-frost-900: #1d3232;
--color-friendly-frost-950: #0d1e1e;
}SCSS
$friendly-frost: #c4f9f9;
$friendly-frost-rgb: 196, 249, 249;
$friendly-frost-light: mix(#fff, $friendly-frost, 20%);
$friendly-frost-dark: mix(#000, $friendly-frost, 20%);
.element {
color: $friendly-frost;
box-shadow: 0 0 0 2px rgba($friendly-frost, 0.35);
}