Pure Grape Riot Drift palette

Colors in Pure Grape Riot Drift: HEX, RGB, HSL & OKLCH

• bg

  #F4E7EF

  #F4E7EF color page →

  RGB

  rgb(244 231 239)

  HSL

  hsl(323 37% 93%)

  OKLCH

  oklch(0.941 0.018 339.9)

  WCAG contrast: on white 1.19:1 (Fail) · on black 17.52:1 (AAA)

• surface

  #BD89B7

  #BD89B7 color page →

  RGB

  rgb(189 137 183)

  HSL

  hsl(307 28% 64%)

  OKLCH

  oklch(0.696 0.089 330.5)

  WCAG contrast: on white 2.82:1 (Fail) · on black 7.42:1 (AAA)

• primary

  #944074

  #944074 color page →

  RGB

  rgb(148 64 116)

  HSL

  hsl(323 40% 42%)

  OKLCH

  oklch(0.499 0.129 344.7)

  WCAG contrast: on white 6.47:1 (AA) · on black 3.24:1 (Fail)

• accent

  #671B30

  #671B30 color page →

  RGB

  rgb(103 27 48)

  HSL

  hsl(343 58% 25%)

  OKLCH

  oklch(0.353 0.109 8.2)

  WCAG contrast: on white 11.82:1 (AAA) · on black 1.77:1 (Fail)

• text

  #15050F

  #15050F color page →

  RGB

  rgb(21 5 15)

  HSL

  hsl(323 62% 5%)

  OKLCH

  oklch(0.149 0.036 342.8)

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

Export Pure Grape Riot Drift: CSS variables, Tailwind & JSON

:root {
  --bg: #f4e7ef;
  --surface: #bd89b7;
  --primary: #944074;
  --accent: #671b30;
  --text: #15050f;
}

@theme {
  --color-bg: #f4e7ef;
  --color-surface: #bd89b7;
  --color-primary: #944074;
  --color-accent: #671b30;
  --color-text: #15050f;
}

{
  "pure-grape-riot-drift-3bc": {
    "bg": {
      "$type": "color",
      "$value": "#f4e7ef"
    },
    "surface": {
      "$type": "color",
      "$value": "#bd89b7"
    },
    "primary": {
      "$type": "color",
      "$value": "#944074"
    },
    "accent": {
      "$type": "color",
      "$value": "#671b30"
    },
    "text": {
      "$type": "color",
      "$value": "#15050f"
    }
  }
}