True Vicious Violet Circuit palette

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

• bg

  #FDEFF9

  #FDEFF9 color page →

  RGB

  rgb(253 239 249)

  HSL

  hsl(317 78% 96%)

  OKLCH

  oklch(0.966 0.02 335.7)

  WCAG contrast: on white 1.11:1 (Fail) · on black 18.89:1 (AAA)

• surface

  #BF95CF

  #BF95CF color page →

  RGB

  rgb(191 149 207)

  HSL

  hsl(283 38% 70%)

  OKLCH

  oklch(0.729 0.094 316.5)

  WCAG contrast: on white 2.49:1 (Fail) · on black 8.41:1 (AAA)

• primary

  #9A4E95

  #9A4E95 color page →

  RGB

  rgb(154 78 149)

  HSL

  hsl(304 33% 45%)

  OKLCH

  oklch(0.542 0.137 329.7)

  WCAG contrast: on white 5.38:1 (AA) · on black 3.89:1 (Fail)

• accent

  #5D1E3A

  #5D1E3A color page →

  RGB

  rgb(93 30 58)

  HSL

  hsl(333 51% 24%)

  OKLCH

  oklch(0.342 0.097 355.9)

  WCAG contrast: on white 12.26:1 (AAA) · on black 1.71:1 (Fail)

• text

  #120710

  #120710 color page →

  RGB

  rgb(18 7 16)

  HSL

  hsl(311 44% 5%)

  OKLCH

  oklch(0.15 0.027 333.5)

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

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

:root {
  --bg: #fdeff9;
  --surface: #bf95cf;
  --primary: #9a4e95;
  --accent: #5d1e3a;
  --text: #120710;
}

@theme {
  --color-bg: #fdeff9;
  --color-surface: #bf95cf;
  --color-primary: #9a4e95;
  --color-accent: #5d1e3a;
  --color-text: #120710;
}

{
  "true-vicious-violet-circuit-33a": {
    "bg": {
      "$type": "color",
      "$value": "#fdeff9"
    },
    "surface": {
      "$type": "color",
      "$value": "#bf95cf"
    },
    "primary": {
      "$type": "color",
      "$value": "#9a4e95"
    },
    "accent": {
      "$type": "color",
      "$value": "#5d1e3a"
    },
    "text": {
      "$type": "color",
      "$value": "#120710"
    }
  }
}