Classic Brilliant Blue Dune palette

Colors in Classic Brilliant Blue Dune: HEX, RGB, HSL & OKLCH

• bg

  #EDF8FF

  #EDF8FF color page →

  RGB

  rgb(237 248 255)

  HSL

  hsl(203 100% 96%)

  OKLCH

  oklch(0.973 0.015 235.4)

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

• surface

  #7BB4C6

  #7BB4C6 color page →

  RGB

  rgb(123 180 198)

  HSL

  hsl(194 40% 63%)

  OKLCH

  oklch(0.737 0.065 219.6)

  WCAG contrast: on white 2.28:1 (Fail) · on black 9.18:1 (AAA)

• primary

  #3277A6

  #3277A6 color page →

  RGB

  rgb(50 119 166)

  HSL

  hsl(204 54% 42%)

  OKLCH

  oklch(0.547 0.101 241.8)

  WCAG contrast: on white 4.85:1 (AA) · on black 4.32:1 (Fail)

• accent

  #004755

  #004755 color page →

  RGB

  rgb(0 71 85)

  HSL

  hsl(190 100% 17%)

  OKLCH

  oklch(0.367 0.065 216.5)

  WCAG contrast: on white 10.33:1 (AAA) · on black 2.03:1 (Fail)

• text

  #030A13

  #030A13 color page →

  RGB

  rgb(3 10 19)

  HSL

  hsl(214 73% 4%)

  OKLCH

  oklch(0.141 0.024 248.8)

  WCAG contrast: on white 19.87:1 (AAA) · on black 1.05:1 (Fail)

Export Classic Brilliant Blue Dune: CSS variables, Tailwind & JSON

:root {
  --bg: #edf8ff;
  --surface: #7bb4c6;
  --primary: #3277a6;
  --accent: #004755;
  --text: #030a13;
}

@theme {
  --color-bg: #edf8ff;
  --color-surface: #7bb4c6;
  --color-primary: #3277a6;
  --color-accent: #004755;
  --color-text: #030a13;
}

{
  "classic-brilliant-blue-dune-4o7": {
    "bg": {
      "$type": "color",
      "$value": "#edf8ff"
    },
    "surface": {
      "$type": "color",
      "$value": "#7bb4c6"
    },
    "primary": {
      "$type": "color",
      "$value": "#3277a6"
    },
    "accent": {
      "$type": "color",
      "$value": "#004755"
    },
    "text": {
      "$type": "color",
      "$value": "#030a13"
    }
  }
}