We started by gathering all the screens and doing a thorough design audit to spot any inconsistencies and see where we could reuse components from the old design system to save time and effort. From there, we mapped out all the components needed to build a flexible design system that supports different themes and can easily adapt to both light and dark modes. While dark mode isn’t live yet, we’ve designed the system to make adding it in the future seamless.

We took inspiration from other design systems and started with the basics, focusing on building the core foundational elements—our atoms. These simple building blocks became the backbone for all our components and patterns. By getting this foundation right, we were able to create a solid, scalable framework that’s easy to build on as we grow.