Cor nomeada · #FFF7DB
Buttermelon
Buttermelon é #FFF7DB: rgb(255 247 219), hsl(47 100% 93%), oklch(0.975 0.038 93.8). Veja tons claros, sombras, harmonias, contraste WCAG e APCA e código CSS, Tailwind v4 e SCSS.
What does Yellow mean? → · Buttermelon color name →
#FFF7DB
oklch(0.975 0.038 93.8)
Conversões de cor
- HEX
- #fff7db
- RGB
- rgb(255 247 219)
- HSL
- hsl(47 100% 93%)
- HWB
- hwb(47 86% 0%)
- OKLCH
- oklch(0.975 0.038 93.8)
- OKLab
- oklab(0.975 -0.003 0.037)
- CIE Lab
- lab(97.32 -0.6 14.52)
- LCH
- lch(97.32 14.54 92.3)
- CMYK
- cmyk(0% 3% 14% 0%)
Tons claros · Sombras · Tons
Tons claros
- FFF8DF
- FFF9E2
- FFF9E6
- FFFAEA
- FFFBED
- FFFCF1
- FFFDF4
- FFFDF8
- FFFEFB
Sombras
- DED7BE
- BEB7A2
- 9E9987
- 807C6D
- 636054
- 48453C
- 2E2C26
- 161511
- 030302
Tons
- F2EBD2
- E4DEC8
- D7D2BF
- CAC6B6
- BDBAAD
- B1AEA4
- A4A29B
- 989792
- 8C8B89
Harmonias de cor
Complementar +180°
- FFF7DB
Buttermelon
- F4F6FF
≈ Mā White
Análoga -30° +30°
- FFF7DB
Buttermelon
- FFF5EC
≈ Ambrosia Ivory
- F1FCE0
≈ Baby Tooth
Tríade +120° +240°
- FFF7DB
Buttermelon
- E9FBFF
≈ Placebo Sky
- FFF3FC
≈ Pinkish White
Complementar dividida +150° +210°
- FFF7DB
Buttermelon
- F0F8FF
≈ Alice Blue
- F9F5FF
≈ Sugar Crystal
Tétrade +90° +180° +270°
- FFF7DB
Buttermelon
- DEFFF9
≈ Cold Canada
- F4F6FF
≈ Mā White
- FFF3F6
≈ Glimpse of Pink
Contraste e acessibilidade
Ag
FailSobre branco
WCAG 1.07:1 · APCA Lc 0
Ag
AAASobre preto
WCAG 19.57:1 · APCA Lc 103
Melhor cor de texto: #000000
WCAG 19.57:1 (AAA) · APCA Lc 103
Contrast pairs
Trechos de código
CSS
:root {
--buttermelon: #fff7db;
--buttermelon-rgb: 255 247 219;
--buttermelon-oklch: oklch(0.975 0.038 93.8);
}
.element {
color: var(--buttermelon);
background-color: hsl(47 100% 93%);
border-color: oklch(0.975 0.038 93.8);
}Tailwind CSS v4
@theme {
--color-buttermelon: #fff7db;
--color-buttermelon-50: #f8f5e9;
--color-buttermelon-100: #ebe8da;
--color-buttermelon-200: #d9d4c3;
--color-buttermelon-300: #bdb8a2;
--color-buttermelon-400: #a69e86;
--color-buttermelon-500: #8e866a;
--color-buttermelon-600: #78725a;
--color-buttermelon-700: #605b48;
--color-buttermelon-800: #474234;
--color-buttermelon-900: #312e23;
--color-buttermelon-950: #1d1a12;
}SCSS
$buttermelon: #fff7db;
$buttermelon-rgb: 255, 247, 219;
$buttermelon-light: mix(#fff, $buttermelon, 20%);
$buttermelon-dark: mix(#000, $buttermelon, 20%);
.element {
color: $buttermelon;
box-shadow: 0 0 0 2px rgba($buttermelon, 0.35);
}