Steady Turquoise Tortoise Harbor palette

Colors in Steady Turquoise Tortoise Harbor: HEX, RGB, HSL & OKLCH

• bg

  #D7F3ED

  #D7F3ED color page →

  RGB

  rgb(215 243 237)

  HSL

  hsl(167 54% 90%)

  OKLCH

  oklch(0.942 0.03 181.3)

  WCAG contrast: on white 1.17:1 (Fail) · on black 17.93:1 (AAA)

• surface

  #4F8176

  #4F8176 color page →

  RGB

  rgb(79 129 118)

  HSL

  hsl(167 24% 41%)

  OKLCH

  oklch(0.564 0.057 178.6)

  WCAG contrast: on white 4.43:1 (Fail) · on black 4.73:1 (AA)

• primary

  #745871

  #745871 color page →

  RGB

  rgb(116 88 113)

  HSL

  hsl(306 14% 40%)

  OKLCH

  oklch(0.498 0.052 329.9)

  WCAG contrast: on white 6.21:1 (AA) · on black 3.37:1 (Fail)

• accent

  #7B5F5A

  #7B5F5A color page →

  RGB

  rgb(123 95 90)

  HSL

  hsl(9 15% 42%)

  OKLCH

  oklch(0.512 0.038 30)

  WCAG contrast: on white 5.79:1 (AA) · on black 3.62:1 (Fail)

• text

  #03120F

  #03120F color page →

  RGB

  rgb(3 18 15)

  HSL

  hsl(168 71% 4%)

  OKLCH

  oklch(0.166 0.024 180.1)

  WCAG contrast: on white 19.13:1 (AAA) · on black 1.09:1 (Fail)

Export Steady Turquoise Tortoise Harbor: CSS variables, Tailwind & JSON

:root {
  --bg: #d7f3ed;
  --surface: #4f8176;
  --primary: #745871;
  --accent: #7b5f5a;
  --text: #03120f;
}

@theme {
  --color-bg: #d7f3ed;
  --color-surface: #4f8176;
  --color-primary: #745871;
  --color-accent: #7b5f5a;
  --color-text: #03120f;
}

{
  "steady-turquoise-tortoise-harbor-5fl": {
    "bg": {
      "$type": "color",
      "$value": "#d7f3ed"
    },
    "surface": {
      "$type": "color",
      "$value": "#4f8176"
    },
    "primary": {
      "$type": "color",
      "$value": "#745871"
    },
    "accent": {
      "$type": "color",
      "$value": "#7b5f5a"
    },
    "text": {
      "$type": "color",
      "$value": "#03120f"
    }
  }
}