Intrepid is a design system I built as part of the 5-week Design Systems Bootcamp course offered through Maven. This course taught basic and advanced techniques for building and maintaining a design system using Figma. I based my design system around a relatively small four hue color palette and the Blinker typeface. Throughout the course, I built around a dozen UI components.

Building a foundation

The foundation of Intrepid is a primitives library file which defines the core color palette, semantic color variables, typographic styles, grid layouts, and surface elevation effects.

Components

Intrepid defines several modular UI components, including: Alert, Tooltip, Button, Avatar, Form, and Navigation elements. Establishing color variables and modes in the primitive library allowed me to easily create both light and dark variations for each component.