Named color

Melon

Melon is a pastel red color with HEX #FDBCB4. According to Colors Encyclopedia, it has RGB 253, 188, 180, HSL 7, 95%, 85%, warm temperature, and is useful for warm accents, food branding, and interior palettes.

#FDBCB4 red warm pastel

HEX #FDBCB4

RGB rgb(253, 188, 180)

HSL hsl(7 95% 85%)

CMYK cmyk(0, 26, 29, 1)

Luminance 0.6014

Contrast Black 13.03:1White 1.61:1

CSS Utilities

--color-melon: #FDBCB4;
.bg-melon { background-color: #FDBCB4; }
.text-melon { color: #FDBCB4; }

Open CSS utility pageReusable variables, classes, examples, and implementation notes

Luminance0.6014

Black text13.03:1AA Pass

White text1.61:1AA Fail

hexCanonical HEX value

rgbRed, green, blue channels

hslHue, saturation, lightness

cmykApproximate print conversion

wcagAA and AAA contrast options

harmoniesMathematical harmony sets

variantsGenerated tone variants

nearestColorsKnowledge graph neighbors

Structured sections

Color systems

{
  "hex": "#FDBCB4",
  "rgb": [
    253,
    188,
    180
  ],
  "hsl": [
    7,
    95,
    85
  ],
  "cmyk": [
    0,
    26,
    29,
    1
  ],
  "luminance": 0.6014,
  "contrast": {
    "black": 13.03,
    "white": 1.61
  }
}

WCAG

{
  "AA": [
    "#000000",
    "#1A1A1A",
    "#36454F"
  ],
  "AAA": [
    "#000000",
    "#1A1A1A"
  ]
}

Harmonies

{
  "complementary": "#B4F5FD",
  "analogous": [
    "#FDB4D0",
    "#FDE1B4"
  ],
  "triadic": [
    "#B4FDBD",
    "#BDB4FD"
  ],
  "tetradic": [
    "#D0FDB4",
    "#B4F5FD",
    "#E1B4FD"
  ],
  "splitComplementary": [
    "#B4FDE1",
    "#B4D0FD"
  ],
  "monochromatic": [
    "#FFFFFF",
    "#FDBCB4",
    "#FB6E5B"
  ]
}

Variants

{
  "light": "#FFFFFF",
  "dark": "#FB6E5B",
  "saturated": "#FFBBB3",
  "desaturated": "#F5C3BD",
  "pastel": "#FFFFFF",
  "neon": "#FFDFDB"
}

Pairings

{
  "best": [
    "#000000",
    "#B4F5FD",
    "#FDB4D0",
    "#FDE1B4"
  ],
  "avoid": [
    "#F5C3BD",
    "#FFFFFF"
  ],
  "neutral": [
    "#1A1A1A",
    "#F5F5F5",
    "#E8E8E4"
  ],
  "highContrast": [
    "#000000"
  ],
  "lowContrast": [
    "#FFFFFF",
    "#F5C3BD"
  ]
}

Knowledge graph

{
  "nearestColors": [
    "light-pink",
    "pastel-coral",
    "baby-pink",
    "cherry-blossom",
    "sakura-pink"
  ],
  "generatedPalettes": [
    "melon"
  ],
  "generatedComparisons": [
    "melon-vs-light-pink",
    "melon-vs-pastel-coral"
  ],
  "relatedFamilies": [
    "/colors/by-family/red",
    "/colors/by-temperature/warm",
    "/colors/by-tone/pastel"
  ],
  "relatedTools": [
    "/harmonies/melon",
    "/wcag/melon",
    "/css/colors/melon",
    "/hex/fdbcb4"
  ],
  "semanticRelations": {
    "broader": [
      "/colors/by-family/red",
      "/colors/by-temperature/warm",
      "/colors/by-tone/pastel"
    ],
    "narrower": [
      "/palettes/melon"
    ],
    "related": [
      "/colors/light-pink",
      "/colors/pastel-coral",
      "/colors/baby-pink",
      "/colors/cherry-blossom",
      "/colors/sakura-pink",
      "/compare/melon-vs-light-pink",
      "/compare/melon-vs-pastel-coral",
      "/harmonies/melon",
      "/wcag/melon",
      "/css/colors/melon",
      "/hex/fdbcb4"
    ]
  }
}

Full JSON dataset

{
  "slug": "melon",
  "name": "Melon",
  "hex": "#FDBCB4",
  "uses": [
    "warm accents",
    "food branding",
    "interior palettes"
  ],
  "psychology": {
    "associations": [
      "warmth",
      "comfort",
      "approachability"
    ],
    "contexts": [
      "hospitality",
      "craft",
      "food",
      "home decor"
    ],
    "avoidIn": [
      "cold technical interfaces"
    ]
  },
  "aliases": [],
  "sourceType": "curated",
  "confidence": "medium",
  "reviewStatus": "manual",
  "sourceUrl": "https://www.colorsencyclopedia.com/assets/colors.json",
  "origin": {
    "type": "common",
    "notes": "Curated common color reference used in design and editorial color systems."
  },
  "family": "red",
  "temperature": "warm",
  "tone": [
    "pastel"
  ],
  "editorialNotes": "Curated internal color record with computed technical properties.",
  "tags": [
    "red",
    "warm",
    "pastel",
    "warm-accents",
    "food-branding",
    "interior-palettes",
    "warmth",
    "comfort",
    "approachability"
  ],
  "popularity": 84,
  "rgb": [
    253,
    188,
    180
  ],
  "hsl": [
    7,
    95,
    85
  ],
  "cmyk": [
    0,
    26,
    29,
    1
  ],
  "luminance": 0.6014,
  "contrast": {
    "black": 13.03,
    "white": 1.61
  },
  "harmonies": {
    "complementary": "#B4F5FD",
    "analogous": [
      "#FDB4D0",
      "#FDE1B4"
    ],
    "triadic": [
      "#B4FDBD",
      "#BDB4FD"
    ],
    "tetradic": [
      "#D0FDB4",
      "#B4F5FD",
      "#E1B4FD"
    ],
    "splitComplementary": [
      "#B4FDE1",
      "#B4D0FD"
    ],
    "monochromatic": [
      "#FFFFFF",
      "#FDBCB4",
      "#FB6E5B"
    ]
  },
  "variants": {
    "light": "#FFFFFF",
    "dark": "#FB6E5B",
    "saturated": "#FFBBB3",
    "desaturated": "#F5C3BD",
    "pastel": "#FFFFFF",
    "neon": "#FFDFDB"
  },
  "wcag": {
    "AA": [
      "#000000",
      "#1A1A1A",
      "#36454F"
    ],
    "AAA": [
      "#000000",
      "#1A1A1A"
    ]
  },
  "css": {
    "variable": "--color-melon: #FDBCB4;",
    "utility": ".bg-melon { background-color: #FDBCB4; }",
    "textUtility": ".text-melon { color: #FDBCB4; }"
  },
  "nearestColors": [
    "light-pink",
    "pastel-coral",
    "baby-pink",
    "cherry-blossom",
    "sakura-pink"
  ],
  "generatedPalettes": [
    "melon"
  ],
  "generatedComparisons": [
    "melon-vs-light-pink",
    "melon-vs-pastel-coral"
  ],
  "relatedFamilies": [
    "/colors/by-family/red",
    "/colors/by-temperature/warm",
    "/colors/by-tone/pastel"
  ],
  "relatedTools": [
    "/harmonies/melon",
    "/wcag/melon",
    "/css/colors/melon",
    "/hex/fdbcb4"
  ],
  "semanticRelations": {
    "broader": [
      "/colors/by-family/red",
      "/colors/by-temperature/warm",
      "/colors/by-tone/pastel"
    ],
    "narrower": [
      "/palettes/melon"
    ],
    "related": [
      "/colors/light-pink",
      "/colors/pastel-coral",
      "/colors/baby-pink",
      "/colors/cherry-blossom",
      "/colors/sakura-pink",
      "/compare/melon-vs-light-pink",
      "/compare/melon-vs-pastel-coral",
      "/harmonies/melon",
      "/wcag/melon",
      "/css/colors/melon",
      "/hex/fdbcb4"
    ]
  },
  "pairings": {
    "best": [
      "#000000",
      "#B4F5FD",
      "#FDB4D0",
      "#FDE1B4"
    ],
    "avoid": [
      "#F5C3BD",
      "#FFFFFF"
    ],
    "neutral": [
      "#1A1A1A",
      "#F5F5F5",
      "#E8E8E4"
    ],
    "highContrast": [
      "#000000"
    ],
    "lowContrast": [
      "#FFFFFF",
      "#F5C3BD"
    ]
  }
}

Color meaning and use

About Melon Color

Melon sits in the red family with warm temperature and pastel visual character. Melon is a commonly used color name in design references, palettes, and editorial color systems.

Its common associations include warmth, comfort, and approachability, which makes it relevant for hospitality and craft. In design work, Melon is most useful for warm accents, food branding, and interior palettes, especially when paired with black text for stronger contrast.

WCAG Accessibility

Contrast checks for Melon against black and white text.

Black text13.03:1AA Pass

White text1.61:1AA Fail

AA text options#000000, #1A1A1A, #36454F

AAA text options#000000, #1A1A1A

Open WCAG pageDetailed contrast notes, warnings, alternatives, and UI examples

Similar Colors

Light Pink#FFB6C1

Pastel Coral#FFB3A7

Baby Pink#F4C2C2

Cherry Blossom#FFB7C5

Sakura Pink#FFB7C5

Color Harmonies

#B4F5FD#B4F5FD

#FDB4D0#FDB4D0

#FDE1B4#FDE1B4

#B4FDBD#B4FDBD

#BDB4FD#BDB4FD

Open full Melon harmony pageComplementary, analogous, triadic, tetradic, split, and monochromatic sets

Variants

White#FFFFFF

#FB6E5B#FB6E5B

#FFBBB3#FFBBB3

#F5C3BD#F5C3BD

White#FFFFFF

#FFDFDB#FFDFDB

Pairings

Black#000000

#B4F5FD#B4F5FD

#FDB4D0#FDB4D0

#FDE1B4#FDE1B4

Matte Black#1A1A1A

White Smoke#F5F5F5

Melon

CSS Utilities

Machine-Readable Color Data (JSON)

About Melon Color

Related Color Guides

WCAG Accessibility

Similar Colors

Color Harmonies

Variants

Pairings