Steady Clouded Pine Horizon palette

Colors in Steady Clouded Pine Horizon: HEX, RGB, HSL & OKLCH

• bg

  #E3F2E7

  #E3F2E7 color page →

  RGB

  rgb(227 242 231)

  HSL

  hsl(136 37% 92%)

  OKLCH

  oklch(0.947 0.022 154.1)

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

• surface

  #A4B79D

  #A4B79D color page →

  RGB

  rgb(164 183 157)

  HSL

  hsl(104 15% 67%)

  OKLCH

  oklch(0.758 0.042 137.2)

  WCAG contrast: on white 2.13:1 (Fail) · on black 9.83:1 (AAA)

• primary

  #558B6F

  #558B6F color page →

  RGB

  rgb(85 139 111)

  HSL

  hsl(149 24% 44%)

  OKLCH

  oklch(0.591 0.072 160.5)

  WCAG contrast: on white 3.95:1 (Fail) · on black 5.30:1 (AA)

• accent

  #295247

  #295247 color page →

  RGB

  rgb(41 82 71)

  HSL

  hsl(164 33% 24%)

  OKLCH

  oklch(0.405 0.05 174.2)

  WCAG contrast: on white 8.77:1 (AAA) · on black 2.39:1 (Fail)

• text

  #151B18

  #151B18 color page →

  RGB

  rgb(21 27 24)

  HSL

  hsl(150 13% 9%)

  OKLCH

  oklch(0.215 0.011 163.8)

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

Export Steady Clouded Pine Horizon: CSS variables, Tailwind & JSON

:root {
  --bg: #e3f2e7;
  --surface: #a4b79d;
  --primary: #558b6f;
  --accent: #295247;
  --text: #151b18;
}

@theme {
  --color-bg: #e3f2e7;
  --color-surface: #a4b79d;
  --color-primary: #558b6f;
  --color-accent: #295247;
  --color-text: #151b18;
}

{
  "steady-clouded-pine-horizon-71i": {
    "bg": {
      "$type": "color",
      "$value": "#e3f2e7"
    },
    "surface": {
      "$type": "color",
      "$value": "#a4b79d"
    },
    "primary": {
      "$type": "color",
      "$value": "#558b6f"
    },
    "accent": {
      "$type": "color",
      "$value": "#295247"
    },
    "text": {
      "$type": "color",
      "$value": "#151b18"
    }
  }
}