Classic Beefy Pink Dune palette

Colors in Classic Beefy Pink Dune: HEX, RGB, HSL & OKLCH

• bg

  #F8F7FE

  #F8F7FE color page →

  RGB

  rgb(248 247 254)

  HSL

  hsl(249 78% 98%)

  OKLCH

  oklch(0.979 0.009 292.8)

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

• surface

  #DCD8F8

  #DCD8F8 color page →

  RGB

  rgb(220 216 248)

  HSL

  hsl(248 70% 91%)

  OKLCH

  oklch(0.895 0.044 291.2)

  WCAG contrast: on white 1.37:1 (Fail) · on black 15.22:1 (AAA)

• primary

  #DCB9EC

  #DCB9EC color page →

  RGB

  rgb(220 185 236)

  HSL

  hsl(281 57% 83%)

  OKLCH

  oklch(0.832 0.079 315.1)

  WCAG contrast: on white 1.72:1 (Fail) · on black 12.19:1 (AAA)

• accent

  #A5C6ED

  #A5C6ED color page →

  RGB

  rgb(165 198 237)

  HSL

  hsl(213 67% 79%)

  OKLCH

  oklch(0.816 0.066 252.8)

  WCAG contrast: on white 1.76:1 (Fail) · on black 11.90:1 (AAA)

• text

  #343446

  #343446 color page →

  RGB

  rgb(52 52 70)

  HSL

  hsl(240 15% 24%)

  OKLCH

  oklch(0.333 0.032 284.6)

  WCAG contrast: on white 12.16:1 (AAA) · on black 1.72:1 (Fail)

Export Classic Beefy Pink Dune: CSS variables, Tailwind & JSON

:root {
  --bg: #f8f7fe;
  --surface: #dcd8f8;
  --primary: #dcb9ec;
  --accent: #a5c6ed;
  --text: #343446;
}

@theme {
  --color-bg: #f8f7fe;
  --color-surface: #dcd8f8;
  --color-primary: #dcb9ec;
  --color-accent: #a5c6ed;
  --color-text: #343446;
}

{
  "classic-beefy-pink-dune-45f": {
    "bg": {
      "$type": "color",
      "$value": "#f8f7fe"
    },
    "surface": {
      "$type": "color",
      "$value": "#dcd8f8"
    },
    "primary": {
      "$type": "color",
      "$value": "#dcb9ec"
    },
    "accent": {
      "$type": "color",
      "$value": "#a5c6ed"
    },
    "text": {
      "$type": "color",
      "$value": "#343446"
    }
  }
}