Case Study
Carrot Design System
A flexible, no-fluff design system based off of Tailwind
Overview
When I started at Carrot, there was very little in terms of designs, and no design system. I built an atomic design system from the ground up in Figma which we dubbed Turnip.
Role and Duration
Lead Product Designer, Design Manager
Research, UI Design, Documentation, Management of Design team
2020–2023
The Problem
“When I joined the team, there wasn’t a formal design system in place. UI components were built on the fly, leading to inconsistencies, duplicated work, and an increasingly difficult product to maintain. It was clear we needed a scalable, unified system to support product growth and improve workflow for both design and engineering.”
Building the Foundation
I built the design system in Figma using an atomic design methodology, ensuring every element — was modular, reusable, and scalable. The system was structured around Tailwind-inspired utility classes to stay aligned with our front-end framework, and I incorporated WordPress design system patterns where applicable for compatibility with the WordPress portion of our app.
Continuing to Refine
As the system grew over time one of the biggest pain points was our bloated collection of over 200 individual button components. Using Figma’s new Variants and Component Properties, I streamlined these down to 24 flexible button variants that could handle all states, sizes, and use cases without redundancy. This cleanup alone made the library faster to navigate and cut down on design time.
Collaboration & Documentation
From the start, this was a tight partnership with our engineering team. I maintained clear documentation and component usage guidelines directly in Figma and within our internal wiki, ensuring seamless handoffs and reducing the need for one-off clarifications. Regular check-ins and feedback loops meant the system stayed usable, practical, and tailored to both design and development needs.
The impact
Since implementing the design system, we’ve seen a measurable reduction in design and engineering time for new features, improved visual consistency across the app, and easier onboarding for new team members. It’s become the foundation for both product and marketing design work, scaling alongside our product while keeping our UI clean, cohesive, and future-proof.
