Cor nomeada · #FBB377
Market Melon
Market Melon é #FBB377: rgb(251 179 119), hsl(27 94% 73%), oklch(0.822 0.114 60.1). Veja tons claros, sombras, harmonias, contraste WCAG e APCA e código CSS, Tailwind v4 e SCSS.
What does Orange mean? → · Market Melon color name →
#FBB377
oklch(0.822 0.114 60.1)
Conversões de cor
- HEX
- #fbb377
- RGB
- rgb(251 179 119)
- HSL
- hsl(27 94% 73%)
- HWB
- hwb(27 47% 2%)
- OKLCH
- oklch(0.822 0.114 60.1)
- OKLab
- oklab(0.822 0.057 0.098)
- CIE Lab
- lab(78.98 22.3 41.41)
- LCH
- lch(78.98 47.03 61.7)
- CMYK
- cmyk(0% 29% 53% 2%)
Tons claros · Sombras · Tons
Tons claros
- FCBB85
- FDC394
- FECAA1
- FED2AF
- FFDABC
- FFE1CA
- FFE9D7
- FFF0E4
- FFF8F2
Sombras
- DA9B67
- BA8457
- 9C6E47
- 7E5838
- 61432A
- 462F1C
- 2D1D10
- 150C05
- 030101
Tons
- EEAE79
- E2A97B
- D6A47C
- C99F7D
- BD9A7E
- B1957F
- A49080
- 988B80
- 8C8580
Harmonias de cor
Complementar +180°
- FBB377
Market Melon
- 87CEFF
≈ Platonic Blue
Análoga -30° +30°
- FBB377
Market Melon
- FFAC9E
≈ Pink Rose Bud
- E1C26A
≈ Highlight Gold
Tríade +120° +240°
- FBB377
Market Melon
- 64DDC8
≈ Jazzy Jade
- CFB5FF
≈ Violet Heaven
Complementar dividida +150° +210°
- FBB377
Market Melon
- 5BD9ED
≈ Electric Lemonade
- AEC3FF
≈ Pastel Blue
Tétrade +90° +180° +270°
- FBB377
Market Melon
- 8DDA9E
≈ Patrice
- 87CEFF
≈ Platonic Blue
- EFAAE8
≈ Land of Dreams
Contraste e acessibilidade
Ag
FailSobre branco
WCAG 1.77:1 · APCA Lc 33
Ag
AAASobre preto
WCAG 11.81:1 · APCA Lc 70
Melhor cor de texto: #000000
WCAG 11.81:1 (AAA) · APCA Lc 70
Contrast pairs
Trechos de código
CSS
:root {
--market-melon: #fbb377;
--market-melon-rgb: 251 179 119;
--market-melon-oklch: oklch(0.822 0.114 60.1);
}
.element {
color: var(--market-melon);
background-color: hsl(27 94% 73%);
border-color: oklch(0.822 0.114 60.1);
}Tailwind CSS v4
@theme {
--color-market-melon: #fbb377;
--color-market-melon-50: #ffefd5;
--color-market-melon-100: #ffe0c2;
--color-market-melon-200: #f8caa3;
--color-market-melon-300: #e2ab7a;
--color-market-melon-400: #cf8e56;
--color-market-melon-500: #bc722b;
--color-market-melon-600: #9f6127;
--color-market-melon-700: #7f4d1f;
--color-market-melon-800: #5f3715;
--color-market-melon-900: #43260e;
--color-market-melon-950: #2b1402;
}SCSS
$market-melon: #fbb377;
$market-melon-rgb: 251, 179, 119;
$market-melon-light: mix(#fff, $market-melon, 20%);
$market-melon-dark: mix(#000, $market-melon, 20%);
.element {
color: $market-melon;
box-shadow: 0 0 0 2px rgba($market-melon, 0.35);
}