True Cucumber Queen Studio palette

Colors in True Cucumber Queen Studio: HEX, RGB, HSL & OKLCH

• bg

  #E5ECE3

  #E5ECE3 color page →

  RGB

  rgb(229 236 227)

  HSL

  hsl(107 19% 91%)

  OKLCH

  oklch(0.935 0.014 138.7)

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

• surface

  #88AB6F

  #88AB6F color page →

  RGB

  rgb(136 171 111)

  HSL

  hsl(95 26% 55%)

  OKLCH

  oklch(0.7 0.092 132.9)

  WCAG contrast: on white 2.59:1 (Fail) · on black 8.10:1 (AAA)

• primary

  #36713B

  #36713B color page →

  RGB

  rgb(54 113 59)

  HSL

  hsl(125 35% 33%)

  OKLCH

  oklch(0.495 0.104 145.5)

  WCAG contrast: on white 5.86:1 (AA) · on black 3.58:1 (Fail)

• accent

  #004326

  #004326 color page →

  RGB

  rgb(0 67 38)

  HSL

  hsl(154 100% 13%)

  OKLCH

  oklch(0.337 0.08 157.3)

  WCAG contrast: on white 11.47:1 (AAA) · on black 1.83:1 (Fail)

• text

  #041204

  #041204 color page →

  RGB

  rgb(4 18 4)

  HSL

  hsl(120 64% 4%)

  OKLCH

  oklch(0.163 0.038 143.6)

  WCAG contrast: on white 19.20:1 (AAA) · on black 1.09:1 (Fail)

Export True Cucumber Queen Studio: CSS variables, Tailwind & JSON

:root {
  --bg: #e5ece3;
  --surface: #88ab6f;
  --primary: #36713b;
  --accent: #004326;
  --text: #041204;
}

@theme {
  --color-bg: #e5ece3;
  --color-surface: #88ab6f;
  --color-primary: #36713b;
  --color-accent: #004326;
  --color-text: #041204;
}

{
  "true-cucumber-queen-studio-4cd": {
    "bg": {
      "$type": "color",
      "$value": "#e5ece3"
    },
    "surface": {
      "$type": "color",
      "$value": "#88ab6f"
    },
    "primary": {
      "$type": "color",
      "$value": "#36713b"
    },
    "accent": {
      "$type": "color",
      "$value": "#004326"
    },
    "text": {
      "$type": "color",
      "$value": "#041204"
    }
  }
}