How to use this design system

Every designer, new and old, should review this system and leave comments, feedback, or questions. This design system is meant to be a single source of truth for the entire design team to stay consistent and reduce duplicative work.


Type

Use this section to organize your team's typography, from button text to body paragraphs. Easily embed your Figma files (that automatically update) and get your team on the same page.

https://www.figma.com/embed?embed_host=notion&url=https%3A%2F%2Fwww.figma.com%2Ffile%2FELA2eUsauhPurBx8cZCTun%2FUntitled%3Fnode-id%3D0%3A1


Templates

Include pre-made components that are stitched together into commonly used templates. If you want to add a new template, you can add it in this Figma file, which is where you can also find all of your design team's templates:

https://www.figma.com/embed?embed_host=notion&url=https%3A%2F%2Fwww.figma.com%2Ffile%2FXEFbBEuHyXolt5cJmBujWV%2FTemplate-Library%3Fnode-id%3D247%3A43


Themes

This section is where your team can find colors, contrast and accessibility guidelines for different themes in your product.

Light and Dark Theme

https://www.figma.com/embed?embed_host=notion&url=https%3A%2F%2Fwww.figma.com%2Ffile%2FpOoLP67zoCt3ac71zM5Dbk%2FTheme-Library-Light-and-Dark%3Fnode-id%3D0%3A1


Icons

List out all iconographic design your team uses. Showcasing brand guidelines and common use cases will help your team stay consistent.

Filled and Outlined Icons