Cor nomeada · #CC7753
Brandied Melon
Brandied Melon é #CC7753: rgb(204 119 83), hsl(18 54% 56%), oklch(0.655 0.118 43.3). Veja tons claros, sombras, harmonias, contraste WCAG e APCA e código CSS, Tailwind v4 e SCSS.
What does Red mean? → · Brandied Melon color name →
#CC7753
oklch(0.655 0.118 43.3)
Conversões de cor
- HEX
- #cc7753
- RGB
- rgb(204 119 83)
- HSL
- hsl(18 54% 56%)
- HWB
- hwb(18 33% 20%)
- OKLCH
- oklch(0.655 0.118 43.3)
- OKLab
- oklab(0.655 0.086 0.081)
- CIE Lab
- lab(59.14 31.65 34.68)
- LCH
- lch(59.14 46.95 47.6)
- CMYK
- cmyk(0% 42% 59% 20%)
Tons claros · Sombras · Tons
Tons claros
- D28564
- D89275
- DEA086
- E3AD97
- E9BBA8
- EEC8B9
- F2D6CB
- F7E4DC
- FBF1ED
Sombras
- B16747
- 97573B
- 7E4730
- 653825
- 4E2A1B
- 371C11
- 221008
- 0F0502
- 020100
Tons
- C57959
- BE7A5E
- B67B63
- AF7C67
- A87D6C
- A07E70
- 987F74
- 907F78
- 88807C
Harmonias de cor
Complementar +180°
- CC7753
Brandied Melon
- 189FC5
≈ Major Blue
Análoga -30° +30°
- CC7753
Brandied Melon
- CE707C
≈ Lotus Red
- BC8432
≈ Mango Brown
Tríade +120° +240°
- CC7753
Brandied Melon
- 3BA77C
≈ Cosmic Green
- 8786D6
≈ Indigo Bloom
Complementar dividida +150° +210°
- CC7753
Brandied Melon
- 00A6A4
≈ Royal Cloak
- 5A94D7
≈ Little Boy Blue
Tétrade +90° +180° +270°
- CC7753
Brandied Melon
- 73A052
≈ Unakite
- 189FC5
≈ Major Blue
- AA7AC4
≈ Wisteria
Contraste e acessibilidade
Ag
FailSobre branco
WCAG 3.31:1 · APCA Lc 60
Ag
AASobre preto
WCAG 6.33:1 · APCA Lc 41
Melhor cor de texto: #000000
WCAG 6.33:1 (AA) · APCA Lc 41
Contrast pairs
Trechos de código
CSS
:root {
--brandied-melon: #cc7753;
--brandied-melon-rgb: 204 119 83;
--brandied-melon-oklch: oklch(0.655 0.118 43.3);
}
.element {
color: var(--brandied-melon);
background-color: hsl(18 54% 56%);
border-color: oklch(0.655 0.118 43.3);
}Tailwind CSS v4
@theme {
--color-brandied-melon: #cc7753;
--color-brandied-melon-50: #ffebda;
--color-brandied-melon-100: #ffdcc8;
--color-brandied-melon-200: #ffc5ab;
--color-brandied-melon-300: #eba485;
--color-brandied-melon-400: #d98664;
--color-brandied-melon-500: #c56941;
--color-brandied-melon-600: #a75938;
--color-brandied-melon-700: #86472c;
--color-brandied-melon-800: #643320;
--color-brandied-melon-900: #462315;
--color-brandied-melon-950: #2d1107;
}SCSS
$brandied-melon: #cc7753;
$brandied-melon-rgb: 204, 119, 83;
$brandied-melon-light: mix(#fff, $brandied-melon, 20%);
$brandied-melon-dark: mix(#000, $brandied-melon, 20%);
.element {
color: $brandied-melon;
box-shadow: 0 0 0 2px rgba($brandied-melon, 0.35);
}