Overview

Components

This page is a look at the components I’ve designed and reused across different projects. Some are custom, some come from trusted systems like Tailwind or Material UI. All of them are built to be accessible, responsive, and easy to work with. Here’s how the whole thing comes together.

Process

💬
Hang out with stakeholders and explore their feedback.
🔬
Conduct a UX audit and research the existing product.
🎯
Define the goals based on the problems.
💭
Develop a detailed design system
🧪
Impact testing using prototypes

Ensuring that all components are available for fast paced delivery without cutting corners.

This page highlights the reusable components that power my work across different products. It shows how I design for flexibility, accessibility, and team workflows—whether that’s building from scratch or adapting trusted libraries. Below is an overview of how the system is structured and how it works in practice.

Built to scale
This component library includes hundreds of reusable parts, from small elements like buttons to full components like cards and modals. It’s spread across multiple files and adapts depending on the project.

Use what fits
I use systems like Tailwind, Material UI, or Apple’s HIG when speed and reliability matter. Other times, I design components from scratch. Everything is accessibility-first and responsive by default.

Made with the team
I build in collaboration with developers and test with others across the team. Nothing ships without a second (or third) set of eyes. The documentation is always evolving to reflect what we’ve learned.

Explore on Figma

Can't access Figma?

Not to worry, explore some images below.