Classic Vicious Violet Cascade palette

Colors in Classic Vicious Violet Cascade: HEX, RGB, HSL & OKLCH

• bg

  #EFE3F7

  #EFE3F7 color page →

  RGB

  rgb(239 227 247)

  HSL

  hsl(276 56% 93%)

  OKLCH

  oklch(0.931 0.03 312.1)

  WCAG contrast: on white 1.23:1 (Fail) · on black 17.00:1 (AAA)

• surface

  #895E9F

  #895E9F color page →

  RGB

  rgb(137 94 159)

  HSL

  hsl(280 26% 50%)

  OKLCH

  oklch(0.553 0.109 313.6)

  WCAG contrast: on white 5.04:1 (AA) · on black 4.16:1 (Fail)

• primary

  #4C773A

  #4C773A color page →

  RGB

  rgb(76 119 58)

  HSL

  hsl(102 34% 35%)

  OKLCH

  oklch(0.522 0.102 137.2)

  WCAG contrast: on white 5.24:1 (AA) · on black 4.00:1 (Fail)

• accent

  #00627D

  #00627D color page →

  RGB

  rgb(0 98 125)

  HSL

  hsl(193 100% 25%)

  OKLCH

  oklch(0.462 0.087 225)

  WCAG contrast: on white 6.90:1 (AA) · on black 3.04:1 (Fail)

• text

  #0C090D

  #0C090D color page →

  RGB

  rgb(12 9 13)

  HSL

  hsl(285 18% 4%)

  OKLCH

  oklch(0.146 0.01 317.7)

  WCAG contrast: on white 19.80:1 (AAA) · on black 1.06:1 (Fail)

Export Classic Vicious Violet Cascade: CSS variables, Tailwind & JSON

:root {
  --bg: #efe3f7;
  --surface: #895e9f;
  --primary: #4c773a;
  --accent: #00627d;
  --text: #0c090d;
}

@theme {
  --color-bg: #efe3f7;
  --color-surface: #895e9f;
  --color-primary: #4c773a;
  --color-accent: #00627d;
  --color-text: #0c090d;
}

{
  "classic-vicious-violet-cascade-5qu": {
    "bg": {
      "$type": "color",
      "$value": "#efe3f7"
    },
    "surface": {
      "$type": "color",
      "$value": "#895e9f"
    },
    "primary": {
      "$type": "color",
      "$value": "#4c773a"
    },
    "accent": {
      "$type": "color",
      "$value": "#00627d"
    },
    "text": {
      "$type": "color",
      "$value": "#0c090d"
    }
  }
}