Muted Dancing Sea System palette

Colors in Muted Dancing Sea System: HEX, RGB, HSL & OKLCH

• bg

  #DCF3F5

  #DCF3F5 color page →

  RGB

  rgb(220 243 245)

  HSL

  hsl(185 56% 91%)

  OKLCH

  oklch(0.948 0.024 203.1)

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

• surface

  #00D2BF

  #00D2BF color page →

  RGB

  rgb(0 210 191)

  HSL

  hsl(175 100% 41%)

  OKLCH

  oklch(0.776 0.138 183.5)

  WCAG contrast: on white 1.91:1 (Fail) · on black 10.97:1 (AAA)

• primary

  #0099C5

  #0099C5 color page →

  RGB

  rgb(0 153 197)

  HSL

  hsl(193 100% 39%)

  OKLCH

  oklch(0.637 0.123 227.2)

  WCAG contrast: on white 3.30:1 (Fail) · on black 6.36:1 (AA)

• accent

  #004996

  #004996 color page →

  RGB

  rgb(0 73 150)

  HSL

  hsl(211 100% 29%)

  OKLCH

  oklch(0.415 0.141 255.9)

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

• text

  #001C29

  #001C29 color page →

  RGB

  rgb(0 28 41)

  HSL

  hsl(199 100% 8%)

  OKLCH

  oklch(0.212 0.043 231.4)

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

Export Muted Dancing Sea System: CSS variables, Tailwind & JSON

:root {
  --bg: #dcf3f5;
  --surface: #00d2bf;
  --primary: #0099c5;
  --accent: #004996;
  --text: #001c29;
}

@theme {
  --color-bg: #dcf3f5;
  --color-surface: #00d2bf;
  --color-primary: #0099c5;
  --color-accent: #004996;
  --color-text: #001c29;
}

{
  "muted-dancing-sea-system-5bb": {
    "bg": {
      "$type": "color",
      "$value": "#dcf3f5"
    },
    "surface": {
      "$type": "color",
      "$value": "#00d2bf"
    },
    "primary": {
      "$type": "color",
      "$value": "#0099c5"
    },
    "accent": {
      "$type": "color",
      "$value": "#004996"
    },
    "text": {
      "$type": "color",
      "$value": "#001c29"
    }
  }
}