A year ago, our product looked like it was built by five different companies. Every page had slightly different spacing, inconsistent typography, and buttons that came in at least seven different styles. Sound familiar?
We decided to build a design system from scratch. Not because it's trendy, but because the inconsistency was actively hurting our users. They'd learn a pattern on one page and find it broken on the next.
Our approach was pragmatic: we started by auditing every component in our product and categorizing them. We found we had 23 different button styles, 11 card variations, and 4 competing color palettes. The first step was simply picking winners and documenting them.
The result is our internal design system, which we've open-sourced. It includes a token system for colors, spacing, and typography; a component library built on React and Tailwind; and documentation that explains not just what each component looks like, but when and why to use it.