Clear Electric Lettuce Grove palette

Colors in Clear Electric Lettuce Grove: HEX, RGB, HSL & OKLCH

• bg

  #E3EEEB

  #E3EEEB color page →

  RGB

  rgb(227 238 235)

  HSL

  hsl(164 24% 91%)

  OKLCH

  oklch(0.94 0.012 178)

  WCAG contrast: on white 1.18:1 (Fail) · on black 17.69:1 (AAA)

• surface

  #73CF7B

  #73CF7B color page →

  RGB

  rgb(115 207 123)

  HSL

  hsl(125 49% 63%)

  OKLCH

  oklch(0.777 0.147 145.9)

  WCAG contrast: on white 1.91:1 (Fail) · on black 10.94:1 (AAA)

• primary

  #00A47C

  #00A47C color page →

  RGB

  rgb(0 164 124)

  HSL

  hsl(165 100% 32%)

  OKLCH

  oklch(0.638 0.13 167.8)

  WCAG contrast: on white 3.18:1 (Fail) · on black 6.60:1 (AA)

• accent

  #006078

  #006078 color page →

  RGB

  rgb(0 96 120)

  HSL

  hsl(192 100% 24%)

  OKLCH

  oklch(0.454 0.084 222.6)

  WCAG contrast: on white 7.13:1 (AAA) · on black 2.94:1 (Fail)

• text

  #001F13

  #001F13 color page →

  RGB

  rgb(0 31 19)

  HSL

  hsl(157 100% 6%)

  OKLCH

  oklch(0.212 0.045 164)

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

Export Clear Electric Lettuce Grove: CSS variables, Tailwind & JSON

:root {
  --bg: #e3eeeb;
  --surface: #73cf7b;
  --primary: #00a47c;
  --accent: #006078;
  --text: #001f13;
}

@theme {
  --color-bg: #e3eeeb;
  --color-surface: #73cf7b;
  --color-primary: #00a47c;
  --color-accent: #006078;
  --color-text: #001f13;
}

{
  "clear-electric-lettuce-grove-5as": {
    "bg": {
      "$type": "color",
      "$value": "#e3eeeb"
    },
    "surface": {
      "$type": "color",
      "$value": "#73cf7b"
    },
    "primary": {
      "$type": "color",
      "$value": "#00a47c"
    },
    "accent": {
      "$type": "color",
      "$value": "#006078"
    },
    "text": {
      "$type": "color",
      "$value": "#001f13"
    }
  }
}