A four-year-old taps through LittleStory alone, so the controls have to be right. My coding agent kept rebuilding buttons from scratch, each one slightly different, because it could not see the components already in the project. Giving the agent a component library it can read ended the guessing — and kept the accessibility obligations off my plate.
ai-codingdesign-systemsaccessibilityreactindie-devlittle-storyFour buttons in four screens
The screen I care most about in LittleStory is the one where the story actually happens: one photo, eight seconds of my daughter's own voice, one sentence from me, turned into an illustrated bedtime story she can tap through alone. Large targets. Nothing to mis-hit. No reading required.
Last month I asked my coding agent for one new settings screen and it handed me a fourth button. A pill on one page, a rectangle on another, one with a shadow nobody requested. Each of them was fine on its own. Together they were four different apps.
That is a hard complaint to file, because nothing was broken.
The agent wasn't lazy. It was blind.
It could read my routes, my stores, my copy. It could not see the components that already existed in the project, so every time it needed a button it wrote one from scratch — which is the only honest thing to do when you cannot see the shelf.
The styling was the least of it. A hand-rolled control arrives with invisible obligations: focus order, keyboard handling, the label a screen reader announces. My daughter is four, and her grandmother runs VoiceOver on her phone. Looks fine in the screenshot is not a standard I can ship on.
A library the agent can actually read
So the screens moved onto HeroUI v3. Underneath, React Aria owns interaction and accessibility while Tailwind v4 owns style; on the surface you get components that have already made the tedious decisions. The docs call it beautiful by default, and the side effect I actually felt was that I stopped having opinions about two pixels of border radius.
The part I did not expect: it ships its documentation in a form a coding agent can open directly. My agent stopped inventing buttons because it could finally see the ones that already existed, read how they take props, and compose them instead of guessing. The fourth style never came back — and it was not the model that got smarter.
What the library still can't decide
It cannot decide when the page should turn. LittleStory is not a form; most of the product is timing — the half-second of quiet before the good part, the beat where the illustration lands. That I still write by hand, and I want to, because it is the only part a competitor cannot install.
One honest caveat. Adopting a component library means accepting its opinions about how pieces are composed. On a fresh screen that is a gift. On a design system you have spent a year refining, price the migration before you start.