Named color

Naples Yellow

Naples Yellow color #FADA5E: RGB 250, 218, 94 and HSL 48°, 94%, 67%. Explore its warm yellow profile, contrast, CSS, palettes and harmonies.

#FADA5E yellow warm vibrant

HEX #FADA5E

RGB rgb(250, 218, 94)

HSL hsl(48 94% 67%)

CMYK cmyk(0, 13, 62, 2)

Luminance 0.7127

Contrast Black 15.25:1White 1.38:1

Use this color

Create with Naples Yellow

Open a professional color tool with #FADA5E already applied. Each configuration stays canonical to the tool and can be adjusted or shared.

All color tools

Generate palette & CSS variablesCreate 50–950 tokens and export CSS, SCSS, JSON, or Tailwind.Open configured tool →Open in Gradient StudioStart with Naples Yellow and its complementary color.Open configured tool →Mix this colorBlend it with a complementary color and copy color-mix() CSS.Open configured tool →Check contrastOpen the strongest black or white background pairing.Open configured tool →Accessible combinationsReview AA and AAA text options, alternatives, warnings, and UI guidance.Open configured tool →Create glass surfaceUse this color as the tint for a translucent UI panel.Open configured tool →

CSS Utilities

--color-naples-yellow: #FADA5E;
.bg-naples-yellow { background-color: #FADA5E; }
.text-naples-yellow { color: #FADA5E; }

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

Color history, meaning and use · Editorially reviewed

About Naples Yellow Color

Naples yellow commonly refers to lead antimonate, one of the oldest synthetic yellow colorants. It was used to tint ancient ceramic glazes and has been identified in Egyptian glass, while later artists valued related formulations for opacity, tinting strength, drying behavior, and a warm light useful in landscape painting. Its name does not guarantee that every historical tube or painted passage has the same recipe.

The digital color is a muted, sun-warmed yellow suited to plaster, ceramic, editorial, and heritage-inspired palettes. It sits more quietly than a signal yellow and can support dark blue, umber, or charcoal typography when contrast is tested. Historic lead-containing material is a conservation and health matter; a HEX approximation neither identifies the pigment nor reproduces its covering power and aging behavior.

This is a screen-color reference, not a lead-pigment recipe, safety assessment, conservation diagnosis, or substitute for laboratory analysis.

WCAG Accessibility

Contrast checks for Naples Yellow against black and white text.

Black text15.25:1AA Pass

White text1.38:1AA Fail

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

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

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

Downloadable color reference infographic

Naples Yellow Color Reference Infographic

Save a high-resolution infographic of Naples Yellow, including its color values, coordinated palette, and black and white text contrast.

1200 × 800

Naples Yellow color reference infographic showing #FADA5E, RGB and HSL values, a coordinated palette, and black and white text contrast. — Naples Yellow color reference infographic generated from the verified Colors Encyclopedia dataset.

Download WebP Download SVG Open full size

Color Harmonies

#5C7BFA#5C7BFA #FA8B5C#FA8B5C #CAFA5C#CAFA5C #5CFADA#5CFADA #DA5CFA#DA5CFA

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

Variants

#FDEEB5#FDEEB5 #F2C307#F2C307 #FFDD57#FFDD57 #E7CF6E#E7CF6E #FBF4DA#FBF4DA #FFE680#FFE680

Pairings

Black#000000 #5C7BFA#5C7BFA #FA8B5C#FA8B5C #CAFA5C#CAFA5C Matte Black#1A1A1A White Smoke#F5F5F5

Luminance0.7127

Black text15.25:1AA Pass

White text1.38: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": "#FADA5E",
  "rgb": [
    250,
    218,
    94
  ],
  "hsl": [
    48,
    94,
    67
  ],
  "cmyk": [
    0,
    13,
    62,
    2
  ],
  "luminance": 0.7127,
  "contrast": {
    "black": 15.25,
    "white": 1.38
  }
}

WCAG

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

Harmonies

{
  "complementary": "#5C7BFA",
  "analogous": [
    "#FA8B5C",
    "#CAFA5C"
  ],
  "triadic": [
    "#5CFADA",
    "#DA5CFA"
  ],
  "tetradic": [
    "#5CFA8B",
    "#5C7BFA",
    "#FA5CCA"
  ],
  "splitComplementary": [
    "#5CCAFA",
    "#8B5CFA"
  ],
  "monochromatic": [
    "#FDEEB5",
    "#FADA5E",
    "#F2C307"
  ]
}

Variants

{
  "light": "#FDEEB5",
  "dark": "#F2C307",
  "saturated": "#FFDD57",
  "desaturated": "#E7CF6E",
  "pastel": "#FBF4DA",
  "neon": "#FFE680"
}

Pairings

{
  "best": [
    "#000000",
    "#5C7BFA",
    "#FA8B5C",
    "#CAFA5C"
  ],
  "avoid": [
    "#E7CF6E",
    "#FDEEB5"
  ],
  "neutral": [
    "#1A1A1A",
    "#F5F5F5",
    "#E8E8E4"
  ],
  "highContrast": [
    "#000000"
  ],
  "lowContrast": [
    "#FDEEB5",
    "#E7CF6E"
  ]
}

Knowledge graph

{
  "nearestColors": [
    "mustard",
    "maize",
    "straw",
    "topaz",
    "flax"
  ],
  "generatedPalettes": [
    "naples-yellow"
  ],
  "generatedComparisons": [
    "laser-lemon-vs-naples-yellow",
    "maize-vs-naples-yellow",
    "mustard-vs-naples-yellow",
    "straw-vs-naples-yellow"
  ],
  "relatedFamilies": [
    "/colors/by-family/yellow",
    "/colors/by-temperature/warm",
    "/colors/by-tone/vibrant"
  ],
  "relatedTools": [
    "/harmonies/naples-yellow",
    "/wcag/naples-yellow",
    "/css/colors/naples-yellow",
    "/hex/fada5e",
    "/tools/css-gradient-generator",
    "/tools/color-palette-generator",
    "/tools/css-color-mixer",
    "/tools/contrast-checker"
  ],
  "semanticRelations": {
    "broader": [
      "/colors/by-family/yellow",
      "/colors/by-temperature/warm",
      "/colors/by-tone/vibrant"
    ],
    "narrower": [
      "/palettes/naples-yellow"
    ],
    "related": [
      "/colors/mustard",
      "/colors/maize",
      "/colors/straw",
      "/colors/topaz",
      "/colors/flax",
      "/compare/laser-lemon-vs-naples-yellow",
      "/compare/maize-vs-naples-yellow",
      "/compare/mustard-vs-naples-yellow",
      "/compare/straw-vs-naples-yellow",
      "/harmonies/naples-yellow",
      "/wcag/naples-yellow",
      "/css/colors/naples-yellow",
      "/hex/fada5e",
      "/tools/css-gradient-generator",
      "/tools/color-palette-generator",
      "/tools/css-color-mixer",
      "/tools/contrast-checker"
    ]
  }
}

Full JSON dataset

{
  "slug": "naples-yellow",
  "name": "Naples Yellow",
  "hex": "#FADA5E",
  "uses": [
    "historical references",
    "pigment palettes",
    "cultural color systems"
  ],
  "psychology": {
    "associations": [
      "heritage",
      "craft",
      "specificity"
    ],
    "contexts": [
      "museum design",
      "education",
      "editorial research",
      "cultural references"
    ],
    "avoidIn": [
      "generic unlabeled palette systems"
    ]
  },
  "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, material, cultural, and editorial color systems."
  },
  "family": "yellow",
  "temperature": "warm",
  "tone": [
    "vibrant"
  ],
  "editorialNotes": "Curated internal color record with computed technical properties.",
  "tags": [
    "yellow",
    "warm",
    "vibrant",
    "historical-references",
    "pigment-palettes",
    "cultural-color-systems",
    "heritage",
    "craft",
    "specificity"
  ],
  "popularity": 84,
  "rgb": [
    250,
    218,
    94
  ],
  "hsl": [
    48,
    94,
    67
  ],
  "cmyk": [
    0,
    13,
    62,
    2
  ],
  "luminance": 0.7127,
  "contrast": {
    "black": 15.25,
    "white": 1.38
  },
  "harmonies": {
    "complementary": "#5C7BFA",
    "analogous": [
      "#FA8B5C",
      "#CAFA5C"
    ],
    "triadic": [
      "#5CFADA",
      "#DA5CFA"
    ],
    "tetradic": [
      "#5CFA8B",
      "#5C7BFA",
      "#FA5CCA"
    ],
    "splitComplementary": [
      "#5CCAFA",
      "#8B5CFA"
    ],
    "monochromatic": [
      "#FDEEB5",
      "#FADA5E",
      "#F2C307"
    ]
  },
  "variants": {
    "light": "#FDEEB5",
    "dark": "#F2C307",
    "saturated": "#FFDD57",
    "desaturated": "#E7CF6E",
    "pastel": "#FBF4DA",
    "neon": "#FFE680"
  },
  "wcag": {
    "AA": [
      "#000000",
      "#1A1A1A",
      "#36454F"
    ],
    "AAA": [
      "#000000",
      "#1A1A1A",
      "#36454F"
    ]
  },
  "css": {
    "variable": "--color-naples-yellow: #FADA5E;",
    "utility": ".bg-naples-yellow { background-color: #FADA5E; }",
    "textUtility": ".text-naples-yellow { color: #FADA5E; }"
  },
  "nearestColors": [
    "mustard",
    "maize",
    "straw",
    "topaz",
    "flax"
  ],
  "generatedPalettes": [
    "naples-yellow"
  ],
  "generatedComparisons": [
    "laser-lemon-vs-naples-yellow",
    "maize-vs-naples-yellow",
    "mustard-vs-naples-yellow",
    "straw-vs-naples-yellow"
  ],
  "relatedFamilies": [
    "/colors/by-family/yellow",
    "/colors/by-temperature/warm",
    "/colors/by-tone/vibrant"
  ],
  "relatedTools": [
    "/harmonies/naples-yellow",
    "/wcag/naples-yellow",
    "/css/colors/naples-yellow",
    "/hex/fada5e",
    "/tools/css-gradient-generator",
    "/tools/color-palette-generator",
    "/tools/css-color-mixer",
    "/tools/contrast-checker"
  ],
  "semanticRelations": {
    "broader": [
      "/colors/by-family/yellow",
      "/colors/by-temperature/warm",
      "/colors/by-tone/vibrant"
    ],
    "narrower": [
      "/palettes/naples-yellow"
    ],
    "related": [
      "/colors/mustard",
      "/colors/maize",
      "/colors/straw",
      "/colors/topaz",
      "/colors/flax",
      "/compare/laser-lemon-vs-naples-yellow",
      "/compare/maize-vs-naples-yellow",
      "/compare/mustard-vs-naples-yellow",
      "/compare/straw-vs-naples-yellow",
      "/harmonies/naples-yellow",
      "/wcag/naples-yellow",
      "/css/colors/naples-yellow",
      "/hex/fada5e",
      "/tools/css-gradient-generator",
      "/tools/color-palette-generator",
      "/tools/css-color-mixer",
      "/tools/contrast-checker"
    ]
  },
  "pairings": {
    "best": [
      "#000000",
      "#5C7BFA",
      "#FA8B5C",
      "#CAFA5C"
    ],
    "avoid": [
      "#E7CF6E",
      "#FDEEB5"
    ],
    "neutral": [
      "#1A1A1A",
      "#F5F5F5",
      "#E8E8E4"
    ],
    "highContrast": [
      "#000000"
    ],
    "lowContrast": [
      "#FDEEB5",
      "#E7CF6E"
    ]
  }
}

Naples Yellow

Create with Naples Yellow

CSS Utilities

About Naples Yellow Color

WCAG Accessibility

Naples Yellow Color Reference Infographic

Color Harmonies

Variants

Pairings

Machine-Readable Color Data (JSON)

Similar Colors

Related Color Guides