Classic Pacific Pleasure Vault palette

Colors in Classic Pacific Pleasure Vault: HEX, RGB, HSL & OKLCH

• bg

  #F4F6F7

  #F4F6F7 color page →

  RGB

  rgb(244 246 247)

  HSL

  hsl(200 16% 96%)

  OKLCH

  oklch(0.972 0.003 228.8)

  WCAG contrast: on white 1.08:1 (Fail) · on black 19.37:1 (AAA)

• surface

  #CEE5EB

  #CEE5EB color page →

  RGB

  rgb(206 229 235)

  HSL

  hsl(192 42% 86%)

  OKLCH

  oklch(0.907 0.026 215.1)

  WCAG contrast: on white 1.30:1 (Fail) · on black 16.03:1 (AAA)

• muted

  #A2B7BD

  #A2B7BD color page →

  RGB

  rgb(162 183 189)

  HSL

  hsl(193 17% 69%)

  OKLCH

  oklch(0.765 0.025 216.8)

  WCAG contrast: on white 2.09:1 (Fail) · on black 10.04:1 (AAA)

• primary

  #347F94

  #347F94 color page →

  RGB

  rgb(52 127 148)

  HSL

  hsl(193 48% 39%)

  OKLCH

  oklch(0.559 0.08 219.4)

  WCAG contrast: on white 4.55:1 (AA) · on black 4.60:1 (AA)

• accent

  #38536C

  #38536C color page →

  RGB

  rgb(56 83 108)

  HSL

  hsl(209 32% 32%)

  OKLCH

  oklch(0.432 0.053 247.2)

  WCAG contrast: on white 8.00:1 (AAA) · on black 2.62:1 (Fail)

• text

  #00161C

  #00161C color page →

  RGB

  rgb(0 22 28)

  HSL

  hsl(193 100% 5%)

  OKLCH

  oklch(0.185 0.033 216.7)

  WCAG contrast: on white 18.55:1 (AAA) · on black 1.13:1 (Fail)

Export Classic Pacific Pleasure Vault: CSS variables, Tailwind & JSON

:root {
  --bg: #f4f6f7;
  --surface: #cee5eb;
  --muted: #a2b7bd;
  --primary: #347f94;
  --accent: #38536c;
  --text: #00161c;
}

@theme {
  --color-bg: #f4f6f7;
  --color-surface: #cee5eb;
  --color-muted: #a2b7bd;
  --color-primary: #347f94;
  --color-accent: #38536c;
  --color-text: #00161c;
}

{
  "classic-pacific-pleasure-vault-1o7": {
    "bg": {
      "$type": "color",
      "$value": "#f4f6f7"
    },
    "surface": {
      "$type": "color",
      "$value": "#cee5eb"
    },
    "muted": {
      "$type": "color",
      "$value": "#a2b7bd"
    },
    "primary": {
      "$type": "color",
      "$value": "#347f94"
    },
    "accent": {
      "$type": "color",
      "$value": "#38536c"
    },
    "text": {
      "$type": "color",
      "$value": "#00161c"
    }
  }
}