Cor nomeada mais próxima · #C7AE85
#C7AE85
Cor nomeada mais próxima: Croissant
#C7AE85 (rgb(199 174 133), hsl(37 37% 65%), oklch(0.762 0.062 79.9)) é mais próxima da cor nomeada Croissant. Veja tons claros, sombras, harmonias, contraste WCAG e APCA e código CSS, Tailwind v4 e SCSS.
#C7AE85
oklch(0.762 0.062 79.9)
Conversões de cor
- HEX
- #c7ae85
- RGB
- rgb(199 174 133)
- HSL
- hsl(37 37% 65%)
- HWB
- hwb(37 52% 22%)
- OKLCH
- oklch(0.762 0.062 79.9)
- OKLab
- oklab(0.762 0.011 0.061)
- CIE Lab
- lab(72.54 4.92 24.61)
- LCH
- lch(72.54 25.1 78.7)
- CMYK
- cmyk(0% 13% 33% 22%)
Tons claros · Sombras · Tons
Tons claros
- CDB691
- D2BE9D
- D8C6A9
- DDCEB5
- E3D6C1
- E9DECE
- EEE6DA
- F4EFE6
- F9F7F3
Sombras
- AD9773
- 938061
- 7A6A50
- 625540
- 4C4130
- 362E21
- 211C13
- 0E0B06
- 020101
Tons
- C0A985
- B8A585
- B1A084
- AA9C84
- A39783
- 9C9283
- 958E82
- 8E8982
- 878581
Harmonias de cor
Complementar +180°
- C7AE85
Croissant
- 9BB3DA
≈ Myrtle Flower
Análoga -30° +30°
- C7AE85
Croissant
- D3A78F
≈ Vienna Beige
- B4B688
≈ Sweet Grass
Tríade +120° +240°
- C7AE85
Croissant
- 82BEC1
≈ Riverbed
- C4A6CB
≈ Tea Towel
Complementar dividida +150° +210°
- C7AE85
Croissant
- 89BAD2
≈ Juvie
- B1ACD7
≈ Purple Hibiscus
Tétrade +90° +180° +270°
Contraste e acessibilidade
Ag
FailSobre branco
WCAG 2.13:1 · APCA Lc 42
Ag
AAASobre preto
WCAG 9.82:1 · APCA Lc 60
Melhor cor de texto: #000000
WCAG 9.82:1 (AAA) · APCA Lc 60
Contrast pairs
Trechos de código
CSS
:root {
--croissant: #c7ae85;
--croissant-rgb: 199 174 133;
--croissant-oklch: oklch(0.762 0.062 79.9);
}
.element {
color: var(--croissant);
background-color: hsl(37 37% 65%);
border-color: oklch(0.762 0.062 79.9);
}Tailwind CSS v4
@theme {
--color-croissant: #c7ae85;
--color-croissant-50: #fef4e2;
--color-croissant-100: #f2e6d1;
--color-croissant-200: #e2d2b7;
--color-croissant-300: #c8b594;
--color-croissant-400: #b29b75;
--color-croissant-500: #9c8256;
--color-croissant-600: #846e49;
--color-croissant-700: #6a583a;
--color-croissant-800: #4e4029;
--color-croissant-900: #372c1c;
--color-croissant-950: #21190c;
}SCSS
$croissant: #c7ae85;
$croissant-rgb: 199, 174, 133;
$croissant-light: mix(#fff, $croissant, 20%);
$croissant-dark: mix(#000, $croissant, 20%);
.element {
color: $croissant;
box-shadow: 0 0 0 2px rgba($croissant, 0.35);
}