Solstice Design System

Project Overview

Solstice Labs had five product teams each reinventing their own buttons, forms, and color values, resulting in an inconsistent experience across their whole suite. We built a complete design system: a token-based color and typography scale, a library of reusable components, and clear usage guidelines for every state — hover, focus, error, loading.

Rather than handing over just a Figma file, we implemented the system directly as an HTML/CSS component library that developers could adopt without guesswork. Time from design to shippable component was cut in half, and all five product teams now build on the same shared foundation.