Color Token Generator

Palette

Tokens

[
  {
    "name": "color.brand.1",
    "hex": "#3B82F6",
    "rgb": "59, 130, 246",
    "hsl": "hsl(217.22, 91.22%, 59.8%)"
  },
  {
    "name": "color.brand.2",
    "hex": "#A855F7",
    "rgb": "168, 85, 247",
    "hsl": "hsl(270.74, 91.01%, 65.1%)"
  },
  {
    "name": "color.brand.3",
    "hex": "#EF4444",
    "rgb": "239, 68, 68",
    "hsl": "hsl(0, 84.24%, 60.2%)"
  },
  {
    "name": "color.brand.4",
    "hex": "#10B981",
    "rgb": "16, 185, 129",
    "hsl": "hsl(160.12, 84.08%, 39.41%)"
  },
  {
    "name": "color.brand.5",
    "hex": "#F59E0B",
    "rgb": "245, 158, 11",
    "hsl": "hsl(37.69, 92.13%, 50.2%)"
  }
]