True Grape Riot Studio palette

Colors in True Grape Riot Studio: HEX, RGB, HSL & OKLCH

• bg

  #F4E6F1

  #F4E6F1 color page →

  RGB

  rgb(244 230 241)

  HSL

  hsl(313 39% 93%)

  OKLCH

  oklch(0.939 0.021 332.9)

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

• surface

  #C494C8

  #C494C8 color page →

  RGB

  rgb(196 148 200)

  HSL

  hsl(295 32% 68%)

  OKLCH

  oklch(0.729 0.091 323.9)

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

• primary

  #99498A

  #99498A color page →

  RGB

  rgb(153 73 138)

  HSL

  hsl(311 35% 44%)

  OKLCH

  oklch(0.529 0.135 334.9)

  WCAG contrast: on white 5.71:1 (AA) · on black 3.67:1 (Fail)

• accent

  #632442

  #632442 color page →

  RGB

  rgb(99 36 66)

  HSL

  hsl(331 47% 26%)

  OKLCH

  oklch(0.363 0.098 353.4)

  WCAG contrast: on white 11.28:1 (AAA) · on black 1.86:1 (Fail)

• text

  #10030D

  #10030D color page →

  RGB

  rgb(16 3 13)

  HSL

  hsl(314 68% 4%)

  OKLCH

  oklch(0.132 0.036 335.5)

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

Export True Grape Riot Studio: CSS variables, Tailwind & JSON

:root {
  --bg: #f4e6f1;
  --surface: #c494c8;
  --primary: #99498a;
  --accent: #632442;
  --text: #10030d;
}

@theme {
  --color-bg: #f4e6f1;
  --color-surface: #c494c8;
  --color-primary: #99498a;
  --color-accent: #632442;
  --color-text: #10030d;
}

{
  "true-grape-riot-studio-3yu": {
    "bg": {
      "$type": "color",
      "$value": "#f4e6f1"
    },
    "surface": {
      "$type": "color",
      "$value": "#c494c8"
    },
    "primary": {
      "$type": "color",
      "$value": "#99498a"
    },
    "accent": {
      "$type": "color",
      "$value": "#632442"
    },
    "text": {
      "$type": "color",
      "$value": "#10030d"
    }
  }
}