Classic Vicious Violet Ember palette

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

• bg

  #FBEDFF

  #FBEDFF color page →

  RGB

  rgb(251 237 255)

  HSL

  hsl(287 100% 96%)

  OKLCH

  oklch(0.962 0.028 318.7)

  WCAG contrast: on white 1.12:1 (Fail) · on black 18.65:1 (AAA)

• surface

  #B991D8

  #B991D8 color page →

  RGB

  rgb(185 145 216)

  HSL

  hsl(274 48% 71%)

  OKLCH

  oklch(0.719 0.109 309.6)

  WCAG contrast: on white 2.59:1 (Fail) · on black 8.10:1 (AAA)

• primary

  #924B99

  #924B99 color page →

  RGB

  rgb(146 75 153)

  HSL

  hsl(295 34% 45%)

  OKLCH

  oklch(0.53 0.141 323.9)

  WCAG contrast: on white 5.69:1 (AA) · on black 3.68:1 (Fail)

• accent

  #682752

  #682752 color page →

  RGB

  rgb(104 39 82)

  HSL

  hsl(320 45% 28%)

  OKLCH

  oklch(0.383 0.108 342.9)

  WCAG contrast: on white 10.49:1 (AAA) · on black 2.00:1 (Fail)

• text

  #140B17

  #140B17 color page →

  RGB

  rgb(20 11 23)

  HSL

  hsl(285 35% 7%)

  OKLCH

  oklch(0.168 0.028 317.5)

  WCAG contrast: on white 19.26:1 (AAA) · on black 1.08:1 (Fail)

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

:root {
  --bg: #fbedff;
  --surface: #b991d8;
  --primary: #924b99;
  --accent: #682752;
  --text: #140b17;
}

@theme {
  --color-bg: #fbedff;
  --color-surface: #b991d8;
  --color-primary: #924b99;
  --color-accent: #682752;
  --color-text: #140b17;
}

{
  "classic-vicious-violet-ember-1jn": {
    "bg": {
      "$type": "color",
      "$value": "#fbedff"
    },
    "surface": {
      "$type": "color",
      "$value": "#b991d8"
    },
    "primary": {
      "$type": "color",
      "$value": "#924b99"
    },
    "accent": {
      "$type": "color",
      "$value": "#682752"
    },
    "text": {
      "$type": "color",
      "$value": "#140b17"
    }
  }
}