Named color

Cadmium Red

Cadmium Red color #E30022: RGB 227, 0, 34 and HSL 351°, 100%, 45%. Explore its warm red profile, contrast, CSS, palettes and harmonies.

#E30022 red warm vibrant

HEX #E30022

RGB rgb(227, 0, 34)

HSL hsl(351 100% 45%)

CMYK cmyk(0, 100, 85, 11)

Luminance 0.1645

Contrast Black 4.29:1White 4.9:1

Use this color

Create with Cadmium Red

Open a professional color tool with #E30022 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 Cadmium Red 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-cadmium-red: #E30022;
.bg-cadmium-red { background-color: #E30022; }
.text-cadmium-red { color: #E30022; }

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

Color history, meaning and use · Editorially reviewed

About Cadmium Red Color

Cadmium Red belongs to the modern expansion of manufactured artists’ colors. Museum accounts contrast its twentieth-century arrival with the much longer dominance of cinnabar and vermilion as brilliant reds. The name describes a pigment family whose shades and formulations extend beyond one digital coordinate.

On screen, Cadmium Red reads as a direct, high-energy red suited to focal accents and assertive illustration. Its power makes proportion important: small areas can carry a composition, while large fields need careful contrast and visual-comfort checks. Physical cadmium pigments have handling and disposal considerations that do not apply to a CSS color.

This HEX is an independent digital reference, not a pigment composition, product recommendation, or safety guide.

WCAG Accessibility

Contrast checks for Cadmium Red against black and white text.

Black text4.29:1AA Fail

White text4.9:1AA Pass

AA text options#FFFFFF

AAA text optionsNone in seed set

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

Downloadable color reference infographic

Cadmium Red Color Reference Infographic

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

1200 × 800

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

Download WebP Download SVG Open full size

Color Harmonies

#00E6C3#00E6C3 #E60095#E60095 #E65000#E65000 #22E600#22E600 #0022E6#0022E6

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

Variants

#FF425F#FF425F #8A0015#8A0015 #E60022#E60022 #CC1934#CC1934 #F47185#F47185 #FF0F33#FF0F33

Pairings

White#FFFFFF #00E6C3#00E6C3 #E60095#E60095 #E65000#E65000 Matte Black#1A1A1A White Smoke#F5F5F5

Luminance0.1645

Black text4.29:1AA Fail

White text4.9:1AA Pass

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": "#E30022",
  "rgb": [
    227,
    0,
    34
  ],
  "hsl": [
    351,
    100,
    45
  ],
  "cmyk": [
    0,
    100,
    85,
    11
  ],
  "luminance": 0.1645,
  "contrast": {
    "black": 4.29,
    "white": 4.9
  }
}

WCAG

{
  "AA": [
    "#FFFFFF"
  ],
  "AAA": []
}

Harmonies

{
  "complementary": "#00E6C3",
  "analogous": [
    "#E60095",
    "#E65000"
  ],
  "triadic": [
    "#22E600",
    "#0022E6"
  ],
  "tetradic": [
    "#95E600",
    "#00E6C3",
    "#5000E6"
  ],
  "splitComplementary": [
    "#00E650",
    "#0095E6"
  ],
  "monochromatic": [
    "#FF425F",
    "#E30022",
    "#8A0015"
  ]
}

Variants

{
  "light": "#FF425F",
  "dark": "#8A0015",
  "saturated": "#E60022",
  "desaturated": "#CC1934",
  "pastel": "#F47185",
  "neon": "#FF0F33"
}

Pairings

{
  "best": [
    "#FFFFFF",
    "#00E6C3",
    "#E60095",
    "#E65000"
  ],
  "avoid": [
    "#CC1934",
    "#FF425F"
  ],
  "neutral": [
    "#1A1A1A",
    "#F5F5F5",
    "#E8E8E4"
  ],
  "highContrast": [
    "#FFFFFF"
  ],
  "lowContrast": [
    "#FF425F",
    "#CC1934"
  ]
}

Knowledge graph

{
  "nearestColors": [
    "cherry-red",
    "venetian-red",
    "crimson",
    "signal-red",
    "traffic-red"
  ],
  "generatedPalettes": [
    "cadmium-red"
  ],
  "generatedComparisons": [
    "cadmium-red-vs-cherry-red",
    "cadmium-red-vs-venetian-red",
    "neon-red-vs-cadmium-red"
  ],
  "relatedFamilies": [
    "/colors/by-family/red",
    "/colors/by-temperature/warm",
    "/colors/by-tone/vibrant"
  ],
  "relatedTools": [
    "/harmonies/cadmium-red",
    "/wcag/cadmium-red",
    "/css/colors/cadmium-red",
    "/hex/e30022",
    "/tools/css-gradient-generator",
    "/tools/color-palette-generator",
    "/tools/css-color-mixer",
    "/tools/contrast-checker"
  ],
  "semanticRelations": {
    "broader": [
      "/colors/by-family/red",
      "/colors/by-temperature/warm",
      "/colors/by-tone/vibrant"
    ],
    "narrower": [
      "/palettes/cadmium-red"
    ],
    "related": [
      "/colors/cherry-red",
      "/colors/venetian-red",
      "/colors/crimson",
      "/colors/signal-red",
      "/colors/traffic-red",
      "/compare/cadmium-red-vs-cherry-red",
      "/compare/cadmium-red-vs-venetian-red",
      "/compare/neon-red-vs-cadmium-red",
      "/harmonies/cadmium-red",
      "/wcag/cadmium-red",
      "/css/colors/cadmium-red",
      "/hex/e30022",
      "/tools/css-gradient-generator",
      "/tools/color-palette-generator",
      "/tools/css-color-mixer",
      "/tools/contrast-checker"
    ]
  }
}

Full JSON dataset

{
  "slug": "cadmium-red",
  "name": "Cadmium Red",
  "hex": "#E30022",
  "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": "red",
  "temperature": "warm",
  "tone": [
    "vibrant"
  ],
  "editorialNotes": "Curated internal color record with computed technical properties.",
  "tags": [
    "red",
    "warm",
    "vibrant",
    "historical-references",
    "pigment-palettes",
    "cultural-color-systems",
    "heritage",
    "craft",
    "specificity"
  ],
  "popularity": 84,
  "rgb": [
    227,
    0,
    34
  ],
  "hsl": [
    351,
    100,
    45
  ],
  "cmyk": [
    0,
    100,
    85,
    11
  ],
  "luminance": 0.1645,
  "contrast": {
    "black": 4.29,
    "white": 4.9
  },
  "harmonies": {
    "complementary": "#00E6C3",
    "analogous": [
      "#E60095",
      "#E65000"
    ],
    "triadic": [
      "#22E600",
      "#0022E6"
    ],
    "tetradic": [
      "#95E600",
      "#00E6C3",
      "#5000E6"
    ],
    "splitComplementary": [
      "#00E650",
      "#0095E6"
    ],
    "monochromatic": [
      "#FF425F",
      "#E30022",
      "#8A0015"
    ]
  },
  "variants": {
    "light": "#FF425F",
    "dark": "#8A0015",
    "saturated": "#E60022",
    "desaturated": "#CC1934",
    "pastel": "#F47185",
    "neon": "#FF0F33"
  },
  "wcag": {
    "AA": [
      "#FFFFFF"
    ],
    "AAA": []
  },
  "css": {
    "variable": "--color-cadmium-red: #E30022;",
    "utility": ".bg-cadmium-red { background-color: #E30022; }",
    "textUtility": ".text-cadmium-red { color: #E30022; }"
  },
  "nearestColors": [
    "cherry-red",
    "venetian-red",
    "crimson",
    "signal-red",
    "traffic-red"
  ],
  "generatedPalettes": [
    "cadmium-red"
  ],
  "generatedComparisons": [
    "cadmium-red-vs-cherry-red",
    "cadmium-red-vs-venetian-red",
    "neon-red-vs-cadmium-red"
  ],
  "relatedFamilies": [
    "/colors/by-family/red",
    "/colors/by-temperature/warm",
    "/colors/by-tone/vibrant"
  ],
  "relatedTools": [
    "/harmonies/cadmium-red",
    "/wcag/cadmium-red",
    "/css/colors/cadmium-red",
    "/hex/e30022",
    "/tools/css-gradient-generator",
    "/tools/color-palette-generator",
    "/tools/css-color-mixer",
    "/tools/contrast-checker"
  ],
  "semanticRelations": {
    "broader": [
      "/colors/by-family/red",
      "/colors/by-temperature/warm",
      "/colors/by-tone/vibrant"
    ],
    "narrower": [
      "/palettes/cadmium-red"
    ],
    "related": [
      "/colors/cherry-red",
      "/colors/venetian-red",
      "/colors/crimson",
      "/colors/signal-red",
      "/colors/traffic-red",
      "/compare/cadmium-red-vs-cherry-red",
      "/compare/cadmium-red-vs-venetian-red",
      "/compare/neon-red-vs-cadmium-red",
      "/harmonies/cadmium-red",
      "/wcag/cadmium-red",
      "/css/colors/cadmium-red",
      "/hex/e30022",
      "/tools/css-gradient-generator",
      "/tools/color-palette-generator",
      "/tools/css-color-mixer",
      "/tools/contrast-checker"
    ]
  },
  "pairings": {
    "best": [
      "#FFFFFF",
      "#00E6C3",
      "#E60095",
      "#E65000"
    ],
    "avoid": [
      "#CC1934",
      "#FF425F"
    ],
    "neutral": [
      "#1A1A1A",
      "#F5F5F5",
      "#E8E8E4"
    ],
    "highContrast": [
      "#FFFFFF"
    ],
    "lowContrast": [
      "#FF425F",
      "#CC1934"
    ]
  }
}

Cadmium Red

Create with Cadmium Red

CSS Utilities

About Cadmium Red Color

WCAG Accessibility

Cadmium Red Color Reference Infographic

Color Harmonies

Variants

Pairings

Machine-Readable Color Data (JSON)

Similar Colors

Related Color Guides