Menu

A 794-line design report decided our colours and fonts, and I can now grep for which of its rules survived
📰

A 794-line design report decided our colours and fonts, and I can now grep for which of its rules survived

DEV Community: css·Daniel Pertu·3 days ago
#mLU8KLvj
#devtocss#devto#dev#report#grep
Reading 0:00
15s threshold

Nakodo did not get a redesign. It got a research document first, and the CSS came out of it. The document is still in the repo at docs/design-direction.md : 794 lines, written before a single token changed, opening with the line "Research report. No project files were modified."

I have been publishing engineering posts about this app for most of a month, which means I now have something more useful than the document: a live site and a repo to check it against. So this post is the report, and then the scorecard.

The diagnosis

The report starts by explaining why the screens looked generic, and it is not kind about it:

Why it looks like default shadcn. It is literally the default: zero-chroma OKLCH greys, Geist, the radix-nova ring-bordered rounded-xl cards, and rounded-4xl pill badges. The only colour comes from stock Tailwind emerald/amber/blue/red-50/700 classes in src/components/status-badge.tsx and results-view.tsx .…

Continue reading — create a free account

Join HashtagPLUS to read full articles, follow hashtags, vote, and join the conversation.