{
  "slug": "color",
  "title": "color converter",
  "description": "Hex, rgb, hsl, and oklch — plus a tints-and-shades palette and a WCAG contrast checker.",
  "category": "convert",
  "status": "live",
  "url": "https://aaronchartier.com/tools/color",
  "keywords": [
    "color",
    "hex",
    "rgb",
    "hsl",
    "oklch",
    "contrast",
    "wcag",
    "palette",
    "accessibility"
  ],
  "samples": [
    {
      "label": "convert a teal",
      "query": "input=%2322d3ee"
    },
    {
      "label": "contrast check",
      "query": "input=%2322d3ee&against=%23111827"
    },
    {
      "label": "oklch input",
      "query": "input=oklch(0.78%200.13%20211)"
    }
  ],
  "privacy": "all computation is client-side; no input is transmitted",
  "pageApi": "window.__tools[\"color\"] — run(input), describe(); output in #tool-output",
  "params": {
    "input": "color string — hex (#22d3ee), rgb(34 211 238), hsl(187 86% 53%), or oklch(0.78 0.13 211) (`#input=` pre-fills and auto-runs)",
    "against": "optional second color — adds a WCAG contrast check (`#against=`)"
  },
  "returns": "{ ok, format, hex, rgb, hsl, oklch, values: { rgb, hsl, oklch }, luminance, palette: { hex, l }[] (oklch lightness ramp), clipped? (oklch outside sRGB), contrast?: { ratio, aaNormal, aaLarge, aaaNormal, aaaLarge, against }, error? }",
  "example": {
    "run": {
      "input": "#22d3ee",
      "against": "#111827"
    }
  }
}