Pure Windsurfing Pulse palette

Colors in Pure Windsurfing Pulse: HEX, RGB, HSL & OKLCH

• bg

  #D9EEFC

  #D9EEFC color page →

  RGB

  rgb(217 238 252)

  HSL

  hsl(204 85% 92%)

  OKLCH

  oklch(0.938 0.029 236.9)

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

• surface

  #7AC0DB

  #7AC0DB color page →

  RGB

  rgb(122 192 219)

  HSL

  hsl(197 57% 67%)

  OKLCH

  oklch(0.771 0.08 224.5)

  WCAG contrast: on white 2.02:1 (Fail) · on black 10.39:1 (AAA)

• primary

  #3173A1

  #3173A1 color page →

  RGB

  rgb(49 115 161)

  HSL

  hsl(205 53% 41%)

  OKLCH

  oklch(0.534 0.098 242.3)

  WCAG contrast: on white 5.12:1 (AA) · on black 4.09:1 (Fail)

• accent

  #004A60

  #004A60 color page →

  RGB

  rgb(0 74 96)

  HSL

  hsl(194 100% 19%)

  OKLCH

  oklch(0.381 0.073 225.9)

  WCAG contrast: on white 9.77:1 (AAA) · on black 2.14:1 (Fail)

• text

  #030A19

  #030A19 color page →

  RGB

  rgb(3 10 25)

  HSL

  hsl(221 79% 5%)

  OKLCH

  oklch(0.146 0.036 259.2)

  WCAG contrast: on white 19.78:1 (AAA) · on black 1.06:1 (Fail)

Export Pure Windsurfing Pulse: CSS variables, Tailwind & JSON

:root {
  --bg: #d9eefc;
  --surface: #7ac0db;
  --primary: #3173a1;
  --accent: #004a60;
  --text: #030a19;
}

@theme {
  --color-bg: #d9eefc;
  --color-surface: #7ac0db;
  --color-primary: #3173a1;
  --color-accent: #004a60;
  --color-text: #030a19;
}

{
  "pure-windsurfing-pulse-5bn": {
    "bg": {
      "$type": "color",
      "$value": "#d9eefc"
    },
    "surface": {
      "$type": "color",
      "$value": "#7ac0db"
    },
    "primary": {
      "$type": "color",
      "$value": "#3173a1"
    },
    "accent": {
      "$type": "color",
      "$value": "#004a60"
    },
    "text": {
      "$type": "color",
      "$value": "#030a19"
    }
  }
}