True Turquoise Tide palette

Colors in True Turquoise Tide: HEX, RGB, HSL & OKLCH

• bg

  #001311

  #001311 color page →

  RGB

  rgb(0 19 17)

  HSL

  hsl(174 100% 4%)

  OKLCH

  oklch(0.168 0.029 186.6)

  WCAG contrast: on white 19.06:1 (AAA) · on black 1.10:1 (Fail)

• surface

  #005040

  #005040 color page →

  RGB

  rgb(0 80 64)

  HSL

  hsl(168 100% 16%)

  OKLCH

  oklch(0.385 0.074 173.3)

  WCAG contrast: on white 9.45:1 (AAA) · on black 2.22:1 (Fail)

• primary

  #008D6F

  #008D6F color page →

  RGB

  rgb(0 141 111)

  HSL

  hsl(167 100% 28%)

  OKLCH

  oklch(0.573 0.112 170.9)

  WCAG contrast: on white 4.16:1 (Fail) · on black 5.03:1 (AA)

• accent

  #2DC4A8

  #2DC4A8 color page →

  RGB

  rgb(45 196 168)

  HSL

  hsl(169 63% 47%)

  OKLCH

  oklch(0.738 0.128 176.6)

  WCAG contrast: on white 2.19:1 (Fail) · on black 9.57:1 (AAA)

• text

  #D8FFF4

  #D8FFF4 color page →

  RGB

  rgb(216 255 244)

  HSL

  hsl(163 100% 92%)

  OKLCH

  oklch(0.969 0.043 176.5)

  WCAG contrast: on white 1.07:1 (Fail) · on black 19.53:1 (AAA)

Export True Turquoise Tide: CSS variables, Tailwind & JSON

:root {
  --bg: #001311;
  --surface: #005040;
  --primary: #008d6f;
  --accent: #2dc4a8;
  --text: #d8fff4;
}

@theme {
  --color-bg: #001311;
  --color-surface: #005040;
  --color-primary: #008d6f;
  --color-accent: #2dc4a8;
  --color-text: #d8fff4;
}

{
  "true-turquoise-tide-3b6": {
    "bg": {
      "$type": "color",
      "$value": "#001311"
    },
    "surface": {
      "$type": "color",
      "$value": "#005040"
    },
    "primary": {
      "$type": "color",
      "$value": "#008d6f"
    },
    "accent": {
      "$type": "color",
      "$value": "#2dc4a8"
    },
    "text": {
      "$type": "color",
      "$value": "#d8fff4"
    }
  }
}