True Vicious Violet Archive palette

Colors in True Vicious Violet Archive: HEX, RGB, HSL & OKLCH

• bg

  #F8F2FA

  #F8F2FA color page →

  RGB

  rgb(248 242 250)

  HSL

  hsl(285 44% 96%)

  OKLCH

  oklch(0.968 0.012 317.7)

  WCAG contrast: on white 1.10:1 (Fail) · on black 19.07:1 (AAA)

• surface

  #BA99DA

  #BA99DA color page →

  RGB

  rgb(186 153 218)

  HSL

  hsl(270 47% 73%)

  OKLCH

  oklch(0.736 0.098 307.3)

  WCAG contrast: on white 2.42:1 (Fail) · on black 8.65:1 (AAA)

• primary

  #8E4C96

  #8E4C96 color page →

  RGB

  rgb(142 76 150)

  HSL

  hsl(294 33% 44%)

  OKLCH

  oklch(0.525 0.133 323.1)

  WCAG contrast: on white 5.79:1 (AA) · on black 3.62:1 (Fail)

• accent

  #672655

  #672655 color page →

  RGB

  rgb(103 38 85)

  HSL

  hsl(317 46% 28%)

  OKLCH

  oklch(0.381 0.111 339.8)

  WCAG contrast: on white 10.57:1 (AAA) · on black 1.98:1 (Fail)

• text

  #100614

  #100614 color page →

  RGB

  rgb(16 6 20)

  HSL

  hsl(283 54% 5%)

  OKLCH

  oklch(0.147 0.034 316.2)

  WCAG contrast: on white 19.84:1 (AAA) · on black 1.05:1 (Fail)

Export True Vicious Violet Archive: CSS variables, Tailwind & JSON

:root {
  --bg: #f8f2fa;
  --surface: #ba99da;
  --primary: #8e4c96;
  --accent: #672655;
  --text: #100614;
}

@theme {
  --color-bg: #f8f2fa;
  --color-surface: #ba99da;
  --color-primary: #8e4c96;
  --color-accent: #672655;
  --color-text: #100614;
}

{
  "true-vicious-violet-archive-6wt": {
    "bg": {
      "$type": "color",
      "$value": "#f8f2fa"
    },
    "surface": {
      "$type": "color",
      "$value": "#ba99da"
    },
    "primary": {
      "$type": "color",
      "$value": "#8e4c96"
    },
    "accent": {
      "$type": "color",
      "$value": "#672655"
    },
    "text": {
      "$type": "color",
      "$value": "#100614"
    }
  }
}