Overview
Bolt is a design system documented in code and used by developers long before it existed properly in Figma. When I joined the project, there was a partial library started by an intern: inconsistent, incomplete, and largely ignored by the design team. I rebuilt it from the ground up, and have maintained and evolved it ever since.
What started as a cleanup task became an ongoing ownership role; spanning component architecture, visual design decisions, accessibility improvements, and most recently, preparing the system for AI-native workflows.
Bolt existed as a developer resource (code repo + documentation) but had no reliable Figma counterpart.
The existing Figma library was missing half the components and had significant inconsistencies
Designers had learned to work around it, detaching components and customizing manually, which broke the connection to the codebase and introduced visual drift.
With designers working across products, the lack of a trusted system meant every project started from a different baseline.
I rebuilt nearly all ~60 components from scratch, prioritizing fidelity to the code repository so that what designers used in Figma matched what developers shipped.
Key decisions I made during the rebuild:
Selected screens
01 / 04
Rebuilding the components was the easier half of the job. The harder part was convincing a team of designers who had spent years detaching and customizing to trust the system instead. The shift was gradual. Rather than mandating change, I focused on making the system genuinely better than the workaround - adding properties that covered real use cases, documenting clearly, and being available to support designers when they ran into friction.
Design system work is never finished. In addition to regular bug fixes and component updates, I continuously improve Bolt with accessibility in mind – contrast ratios, focus states, touch targets, and interaction patterns that work across contexts.
What I learned