True Plum Kingdom Studio palette

Colors in True Plum Kingdom Studio: HEX, RGB, HSL & OKLCH

• bg

  #FAEAF1

  #FAEAF1 color page →

  RGB

  rgb(250 234 241)

  HSL

  hsl(334 62% 95%)

  OKLCH

  oklch(0.952 0.02 349.1)

  WCAG contrast: on white 1.15:1 (Fail) · on black 18.10:1 (AAA)

• surface

  #CC96CE

  #CC96CE color page →

  RGB

  rgb(204 150 206)

  HSL

  hsl(298 36% 70%)

  OKLCH

  oklch(0.743 0.099 325.3)

  WCAG contrast: on white 2.38:1 (Fail) · on black 8.82:1 (AAA)

• primary

  #9B3876

  #9B3876 color page →

  RGB

  rgb(155 56 118)

  HSL

  hsl(322 47% 41%)

  OKLCH

  oklch(0.5 0.149 345.3)

  WCAG contrast: on white 6.51:1 (AA) · on black 3.22:1 (Fail)

• accent

  #6B2838

  #6B2838 color page →

  RGB

  rgb(107 40 56)

  HSL

  hsl(346 46% 29%)

  OKLCH

  oklch(0.379 0.097 8.2)

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

• text

  #11070C

  #11070C color page →

  RGB

  rgb(17 7 12)

  HSL

  hsl(330 42% 5%)

  OKLCH

  oklch(0.147 0.021 347.8)

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

Export True Plum Kingdom Studio: CSS variables, Tailwind & JSON

:root {
  --bg: #faeaf1;
  --surface: #cc96ce;
  --primary: #9b3876;
  --accent: #6b2838;
  --text: #11070c;
}

@theme {
  --color-bg: #faeaf1;
  --color-surface: #cc96ce;
  --color-primary: #9b3876;
  --color-accent: #6b2838;
  --color-text: #11070c;
}

{
  "true-plum-kingdom-studio-zz": {
    "bg": {
      "$type": "color",
      "$value": "#faeaf1"
    },
    "surface": {
      "$type": "color",
      "$value": "#cc96ce"
    },
    "primary": {
      "$type": "color",
      "$value": "#9b3876"
    },
    "accent": {
      "$type": "color",
      "$value": "#6b2838"
    },
    "text": {
      "$type": "color",
      "$value": "#11070c"
    }
  }
}