Steady Topiary Green System palette

Colors in Steady Topiary Green System: HEX, RGB, HSL & OKLCH

• bg

  #F8F9F5

  #F8F9F5 color page →

  RGB

  rgb(248 249 245)

  HSL

  hsl(75 25% 97%)

  OKLCH

  oklch(0.98 0.005 117.9)

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

• surface

  #DBDDC4

  #DBDDC4 color page →

  RGB

  rgb(219 221 196)

  HSL

  hsl(65 27% 82%)

  OKLCH

  oklch(0.889 0.033 110.8)

  WCAG contrast: on white 1.38:1 (Fail) · on black 15.15:1 (AAA)

• primary

  #6A740E

  #6A740E color page →

  RGB

  rgb(106 116 14)

  HSL

  hsl(66 78% 25%)

  OKLCH

  oklch(0.533 0.117 115.7)

  WCAG contrast: on white 5.10:1 (AA) · on black 4.11:1 (Fail)

• accent

  #365736

  #365736 color page →

  RGB

  rgb(54 87 54)

  HSL

  hsl(120 23% 28%)

  OKLCH

  oklch(0.422 0.066 144.3)

  WCAG contrast: on white 8.16:1 (AAA) · on black 2.57:1 (Fail)

• text

  #111206

  #111206 color page →

  RGB

  rgb(17 18 6)

  HSL

  hsl(65 50% 5%)

  OKLCH

  oklch(0.177 0.024 112.5)

  WCAG contrast: on white 18.86:1 (AAA) · on black 1.11:1 (Fail)

Export Steady Topiary Green System: CSS variables, Tailwind & JSON

:root {
  --bg: #f8f9f5;
  --surface: #dbddc4;
  --primary: #6a740e;
  --accent: #365736;
  --text: #111206;
}

@theme {
  --color-bg: #f8f9f5;
  --color-surface: #dbddc4;
  --color-primary: #6a740e;
  --color-accent: #365736;
  --color-text: #111206;
}

{
  "steady-topiary-green-system-2kc": {
    "bg": {
      "$type": "color",
      "$value": "#f8f9f5"
    },
    "surface": {
      "$type": "color",
      "$value": "#dbddc4"
    },
    "primary": {
      "$type": "color",
      "$value": "#6a740e"
    },
    "accent": {
      "$type": "color",
      "$value": "#365736"
    },
    "text": {
      "$type": "color",
      "$value": "#111206"
    }
  }
}