Named color

Iris

Iris is a balanced blue color with HEX #5A4FCF. According to Colors Encyclopedia, it has RGB 90, 79, 207, HSL 245, 57%, 56%, cool temperature, and is useful for beauty branding, creative systems, and premium accents.

#5A4FCF blue cool balanced

HEX #5A4FCF

RGB rgb(90, 79, 207)

HSL hsl(245 57% 56%)

CMYK cmyk(57, 62, 0, 19)

Luminance 0.1227

Contrast Black 3.45:1White 6.08:1

CSS Utilities

--color-iris: #5A4FCF;
.bg-iris { background-color: #5A4FCF; }
.text-iris { color: #5A4FCF; }

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

Luminance0.1227

Black text3.45:1AA Fail

White text6.08: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": "#5A4FCF",
  "rgb": [
    90,
    79,
    207
  ],
  "hsl": [
    245,
    57,
    56
  ],
  "cmyk": [
    57,
    62,
    0,
    19
  ],
  "luminance": 0.1227,
  "contrast": {
    "black": 3.45,
    "white": 6.08
  }
}

WCAG

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

Harmonies

{
  "complementary": "#C4CF4F",
  "analogous": [
    "#4F84CF",
    "#994FCF"
  ],
  "triadic": [
    "#CF5A4F",
    "#4FCF5A"
  ],
  "tetradic": [
    "#CF4F84",
    "#C4CF4F",
    "#4FCF99"
  ],
  "splitComplementary": [
    "#CF994F",
    "#84CF4F"
  ],
  "monochromatic": [
    "#9D97E2",
    "#5A4FCF",
    "#332A98"
  ]
}

Variants

{
  "light": "#9D97E2",
  "dark": "#332A98",
  "saturated": "#4536E7",
  "desaturated": "#6E68B6",
  "pastel": "#BEBAE3",
  "neon": "#5747FF"
}

Pairings

{
  "best": [
    "#FFFFFF",
    "#C4CF4F",
    "#4F84CF",
    "#994FCF"
  ],
  "avoid": [
    "#6E68B6",
    "#9D97E2"
  ],
  "neutral": [
    "#1A1A1A",
    "#F5F5F5",
    "#E8E8E4"
  ],
  "highContrast": [
    "#FFFFFF"
  ],
  "lowContrast": [
    "#9D97E2",
    "#6E68B6"
  ]
}

Knowledge graph

{
  "nearestColors": [
    "slate-blue",
    "royal-blue",
    "tanzanite",
    "royal-purple",
    "violet-blue"
  ],
  "generatedPalettes": [
    "iris"
  ],
  "generatedComparisons": [
    "iris-vs-royal-blue",
    "iris-vs-slate-blue"
  ],
  "relatedFamilies": [
    "/colors/by-family/blue",
    "/colors/by-temperature/cool",
    "/colors/by-tone/balanced"
  ],
  "relatedTools": [
    "/harmonies/iris",
    "/wcag/iris",
    "/css/colors/iris",
    "/hex/5a4fcf"
  ],
  "semanticRelations": {
    "broader": [
      "/colors/by-family/blue",
      "/colors/by-temperature/cool",
      "/colors/by-tone/balanced"
    ],
    "narrower": [
      "/palettes/iris"
    ],
    "related": [
      "/colors/slate-blue",
      "/colors/royal-blue",
      "/colors/tanzanite",
      "/colors/royal-purple",
      "/colors/violet-blue",
      "/compare/iris-vs-royal-blue",
      "/compare/iris-vs-slate-blue",
      "/harmonies/iris",
      "/wcag/iris",
      "/css/colors/iris",
      "/hex/5a4fcf"
    ]
  }
}

Full JSON dataset

{
  "slug": "iris",
  "name": "Iris",
  "hex": "#5A4FCF",
  "uses": [
    "beauty branding",
    "creative systems",
    "premium accents"
  ],
  "psychology": {
    "associations": [
      "creativity",
      "depth",
      "softness"
    ],
    "contexts": [
      "beauty",
      "wellness",
      "luxury",
      "creative tools"
    ],
    "avoidIn": [
      "strict operational dashboards"
    ]
  },
  "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": "blue",
  "temperature": "cool",
  "tone": [
    "balanced"
  ],
  "editorialNotes": "Curated internal color record with computed technical properties.",
  "tags": [
    "blue",
    "cool",
    "balanced",
    "beauty-branding",
    "creative-systems",
    "premium-accents",
    "creativity",
    "depth",
    "softness"
  ],
  "popularity": 80,
  "rgb": [
    90,
    79,
    207
  ],
  "hsl": [
    245,
    57,
    56
  ],
  "cmyk": [
    57,
    62,
    0,
    19
  ],
  "luminance": 0.1227,
  "contrast": {
    "black": 3.45,
    "white": 6.08
  },
  "harmonies": {
    "complementary": "#C4CF4F",
    "analogous": [
      "#4F84CF",
      "#994FCF"
    ],
    "triadic": [
      "#CF5A4F",
      "#4FCF5A"
    ],
    "tetradic": [
      "#CF4F84",
      "#C4CF4F",
      "#4FCF99"
    ],
    "splitComplementary": [
      "#CF994F",
      "#84CF4F"
    ],
    "monochromatic": [
      "#9D97E2",
      "#5A4FCF",
      "#332A98"
    ]
  },
  "variants": {
    "light": "#9D97E2",
    "dark": "#332A98",
    "saturated": "#4536E7",
    "desaturated": "#6E68B6",
    "pastel": "#BEBAE3",
    "neon": "#5747FF"
  },
  "wcag": {
    "AA": [
      "#FFFFFF",
      "#F5F5F5"
    ],
    "AAA": []
  },
  "css": {
    "variable": "--color-iris: #5A4FCF;",
    "utility": ".bg-iris { background-color: #5A4FCF; }",
    "textUtility": ".text-iris { color: #5A4FCF; }"
  },
  "nearestColors": [
    "slate-blue",
    "royal-blue",
    "tanzanite",
    "royal-purple",
    "violet-blue"
  ],
  "generatedPalettes": [
    "iris"
  ],
  "generatedComparisons": [
    "iris-vs-royal-blue",
    "iris-vs-slate-blue"
  ],
  "relatedFamilies": [
    "/colors/by-family/blue",
    "/colors/by-temperature/cool",
    "/colors/by-tone/balanced"
  ],
  "relatedTools": [
    "/harmonies/iris",
    "/wcag/iris",
    "/css/colors/iris",
    "/hex/5a4fcf"
  ],
  "semanticRelations": {
    "broader": [
      "/colors/by-family/blue",
      "/colors/by-temperature/cool",
      "/colors/by-tone/balanced"
    ],
    "narrower": [
      "/palettes/iris"
    ],
    "related": [
      "/colors/slate-blue",
      "/colors/royal-blue",
      "/colors/tanzanite",
      "/colors/royal-purple",
      "/colors/violet-blue",
      "/compare/iris-vs-royal-blue",
      "/compare/iris-vs-slate-blue",
      "/harmonies/iris",
      "/wcag/iris",
      "/css/colors/iris",
      "/hex/5a4fcf"
    ]
  },
  "pairings": {
    "best": [
      "#FFFFFF",
      "#C4CF4F",
      "#4F84CF",
      "#994FCF"
    ],
    "avoid": [
      "#6E68B6",
      "#9D97E2"
    ],
    "neutral": [
      "#1A1A1A",
      "#F5F5F5",
      "#E8E8E4"
    ],
    "highContrast": [
      "#FFFFFF"
    ],
    "lowContrast": [
      "#9D97E2",
      "#6E68B6"
    ]
  }
}

Color meaning and use

About Iris Color

Iris sits in the blue family with cool temperature and balanced visual character. Iris is a commonly used color name in design references, palettes, and editorial color systems.

Its common associations include creativity, depth, and softness, which makes it relevant for beauty and wellness. In design work, Iris is most useful for beauty branding, creative systems, and premium accents, especially when paired with white text for stronger contrast.

WCAG Accessibility

Contrast checks for Iris against black and white text.

Black text3.45:1AA Fail

White text6.08:1AA Pass

AA text options#FFFFFF, #F5F5F5

AAA text optionsNone in seed set

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

Similar Colors

Slate Blue#6A5ACD

Royal Blue#4169E1

Tanzanite#4D5DAB

Royal Purple#7851A9

Violet Blue#324AB2

Color Harmonies

#C4CF4F#C4CF4F

#4F84CF#4F84CF

#994FCF#994FCF

#CF5A4F#CF5A4F

#4FCF5A#4FCF5A

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

Variants

#9D97E2#9D97E2

#332A98#332A98

#4536E7#4536E7

#6E68B6#6E68B6

#BEBAE3#BEBAE3

#5747FF#5747FF

Pairings

White#FFFFFF

#C4CF4F#C4CF4F

#4F84CF#4F84CF

#994FCF#994FCF

Matte Black#1A1A1A

White Smoke#F5F5F5

Iris

CSS Utilities

Machine-Readable Color Data (JSON)

About Iris Color

Related Color Guides

WCAG Accessibility

Similar Colors

Color Harmonies

Variants

Pairings