Enchanted Glen Quartz palette

Colors in Enchanted Glen Quartz: HEX, RGB, HSL & OKLCH

• bg

  #E7F1E7

  #E7F1E7 color page →

  RGB

  rgb(231 241 231)

  HSL

  hsl(120 26% 93%)

  OKLCH

  oklch(0.948 0.017 145.4)

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

• surface

  #8BAE7F

  #8BAE7F color page →

  RGB

  rgb(139 174 127)

  HSL

  hsl(105 22% 59%)

  OKLCH

  oklch(0.712 0.077 137.8)

  WCAG contrast: on white 2.48:1 (Fail) · on black 8.45:1 (AAA)

• primary

  #286E30

  #286E30 color page →

  RGB

  rgb(40 110 48)

  HSL

  hsl(127 47% 29%)

  OKLCH

  oklch(0.479 0.118 145.5)

  WCAG contrast: on white 6.24:1 (AA) · on black 3.36:1 (Fail)

• accent

  #004829

  #004829 color page →

  RGB

  rgb(0 72 41)

  HSL

  hsl(154 100% 14%)

  OKLCH

  oklch(0.353 0.084 157.1)

  WCAG contrast: on white 10.71:1 (AAA) · on black 1.95:1 (Fail)

• text

  #011204

  #011204 color page →

  RGB

  rgb(1 18 4)

  HSL

  hsl(131 89% 4%)

  OKLCH

  oklch(0.16 0.042 148.9)

  WCAG contrast: on white 19.27:1 (AAA) · on black 1.08:1 (Fail)

Export Enchanted Glen Quartz: CSS variables, Tailwind & JSON

:root {
  --bg: #e7f1e7;
  --surface: #8bae7f;
  --primary: #286e30;
  --accent: #004829;
  --text: #011204;
}

@theme {
  --color-bg: #e7f1e7;
  --color-surface: #8bae7f;
  --color-primary: #286e30;
  --color-accent: #004829;
  --color-text: #011204;
}

{
  "enchanted-glen-quartz-56": {
    "bg": {
      "$type": "color",
      "$value": "#e7f1e7"
    },
    "surface": {
      "$type": "color",
      "$value": "#8bae7f"
    },
    "primary": {
      "$type": "color",
      "$value": "#286e30"
    },
    "accent": {
      "$type": "color",
      "$value": "#004829"
    },
    "text": {
      "$type": "color",
      "$value": "#011204"
    }
  }
}