Classic Purple Emperor Atelier palette

Colors in Classic Purple Emperor Atelier: HEX, RGB, HSL & OKLCH

• bg

  #E8ECD5

  #E8ECD5 color page →

  RGB

  rgb(232 236 213)

  HSL

  hsl(70 38% 88%)

  OKLCH

  oklch(0.934 0.031 115)

  WCAG contrast: on white 1.20:1 (Fail) · on black 17.39:1 (AAA)

• surface

  #718700

  #718700 color page →

  RGB

  rgb(113 135 0)

  HSL

  hsl(70 100% 26%)

  OKLCH

  oklch(0.585 0.14 120.5)

  WCAG contrast: on white 4.06:1 (Fail) · on black 5.16:1 (AA)

• primary

  #7036C1

  #7036C1 color page →

  RGB

  rgb(112 54 193)

  HSL

  hsl(265 56% 48%)

  OKLCH

  oklch(0.487 0.203 297.3)

  WCAG contrast: on white 7.03:1 (AAA) · on black 2.98:1 (Fail)

• accent

  #AB0019

  #AB0019 color page →

  RGB

  rgb(171 0 25)

  HSL

  hsl(351 100% 34%)

  OKLCH

  oklch(0.467 0.189 25.1)

  WCAG contrast: on white 7.64:1 (AAA) · on black 2.74:1 (Fail)

• text

  #070702

  #070702 color page →

  RGB

  rgb(7 7 2)

  HSL

  hsl(60 56% 2%)

  OKLCH

  oklch(0.126 0.017 108.6)

  WCAG contrast: on white 20.18:1 (AAA) · on black 1.04:1 (Fail)

Export Classic Purple Emperor Atelier: CSS variables, Tailwind & JSON

:root {
  --bg: #e8ecd5;
  --surface: #718700;
  --primary: #7036c1;
  --accent: #ab0019;
  --text: #070702;
}

@theme {
  --color-bg: #e8ecd5;
  --color-surface: #718700;
  --color-primary: #7036c1;
  --color-accent: #ab0019;
  --color-text: #070702;
}

{
  "classic-purple-emperor-atelier-7km": {
    "bg": {
      "$type": "color",
      "$value": "#e8ecd5"
    },
    "surface": {
      "$type": "color",
      "$value": "#718700"
    },
    "primary": {
      "$type": "color",
      "$value": "#7036c1"
    },
    "accent": {
      "$type": "color",
      "$value": "#ab0019"
    },
    "text": {
      "$type": "color",
      "$value": "#070702"
    }
  }
}