Pure Emerald City Signal palette

Colors in Pure Emerald City Signal: HEX, RGB, HSL & OKLCH

• bg

  #E7ECE6

  #E7ECE6 color page →

  RGB

  rgb(231 236 230)

  HSL

  hsl(110 14% 91%)

  OKLCH

  oklch(0.938 0.01 140.5)

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

• surface

  #A6B4A7

  #A6B4A7 color page →

  RGB

  rgb(166 180 167)

  HSL

  hsl(124 9% 68%)

  OKLCH

  oklch(0.755 0.024 147.4)

  WCAG contrast: on white 2.16:1 (Fail) · on black 9.70:1 (AAA)

• primary

  #677D66

  #677D66 color page →

  RGB

  rgb(103 125 102)

  HSL

  hsl(117 10% 45%)

  OKLCH

  oklch(0.565 0.043 143.8)

  WCAG contrast: on white 4.46:1 (Fail) · on black 4.70:1 (AA)

• accent

  #374134

  #374134 color page →

  RGB

  rgb(55 65 52)

  HSL

  hsl(106 11% 23%)

  OKLCH

  oklch(0.362 0.026 138.5)

  WCAG contrast: on white 10.66:1 (AAA) · on black 1.96:1 (Fail)

• text

  #060B07

  #060B07 color page →

  RGB

  rgb(6 11 7)

  HSL

  hsl(132 29% 3%)

  OKLCH

  oklch(0.142 0.013 151.5)

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

Export Pure Emerald City Signal: CSS variables, Tailwind & JSON

:root {
  --bg: #e7ece6;
  --surface: #a6b4a7;
  --primary: #677d66;
  --accent: #374134;
  --text: #060b07;
}

@theme {
  --color-bg: #e7ece6;
  --color-surface: #a6b4a7;
  --color-primary: #677d66;
  --color-accent: #374134;
  --color-text: #060b07;
}

{
  "pure-emerald-city-signal-6dn": {
    "bg": {
      "$type": "color",
      "$value": "#e7ece6"
    },
    "surface": {
      "$type": "color",
      "$value": "#a6b4a7"
    },
    "primary": {
      "$type": "color",
      "$value": "#677d66"
    },
    "accent": {
      "$type": "color",
      "$value": "#374134"
    },
    "text": {
      "$type": "color",
      "$value": "#060b07"
    }
  }
}