This post is written as part of the Kiroween 2026 hackathon.

I'm Oldlee, a packaging and product designer in Malaysia. For years I've shipped contact-lens boxes, retail walls and landing pages, and one bug keeps coming back: text nobody can read. Pastel on pastel. Light grey on white. White on mint. Designers call it "ghost text". So for Kiroween I built Ghostlight, a tool that finds it in any screenshot and exorcises it.

What it does

  • Drop a screenshot or packaging proof. A "ghost light" sweeps it and raises a ghost wherever text falls below the WCAG contrast line.
  • Exorcise repaints each ghost with the nearest passing colour, changing only OKLCH lightness, so the hue and the brand stay.
  • Possession re-scans the image the way people with colour-vision deficiency or low vision see it.
  • Séance palette checks every text/background pair and exports CSS variables.

Ghostlight accessibility tool highlighting ghost text on packaging

Live demo: https://old.lat/ghostlight/
Code: https://github.com/Oldleeo/ghostlight

How Kiro changed the way I built it

I used Kiro CLI on a remote Linux box. I'm a designer first, so my usual way of coding with AI is: describe, generate, fix, repeat. Kiro pushed me to write steering docs before any code.

The line that mattered most was one sentence in tech.md: ratios are floored, never rounded up. A 4.497 is a fail. Kiro carried that one rule into the requirements, the design, the code and a property-based test without me repeating it once.

The spec was the second surprise. From a one-paragraph brief Kiro wrote numbered requirements, a design with correctness properties, and a task plan. Then real screenshots broke it: gradients and rounded box corners were flagged as ghosts. Instead of patching, I revised the spec twice (text-likeness, anti-aliasing core, "glyphs cross rows and columns, corners don't") and let Kiro re-implement against it. The landing-page sample went from 24 flagged places, many of them box edges, to 16 places that are all real text.

I also set up two custom agents: ghost-smith builds only from tasks.md, and ghost-auditor is read-only and runs Ghostlight's engine against Ghostlight's own UI. Every pair passes. An accessibility tool that fails its own audit would be a bad joke.

Property-based tests caught a bug unit tests didn't: exorcising white text on a mint button painted a black bar on the white label next to it. Now there's a property for that.

What's next

Font-size awareness, a Figma plugin, and batch scans of whole design systems.

If you design anything with text on it, try a screenshot on Ghostlight and see how many ghosts you've been living with.