Design System
This page contains my (work in progress) personal design system. The goal of this design system is to create a consistent user experience across my projects and to make it easier to reuse components between my projects.
This design system is roughly based on the Atomic Design Methodology, with my design system split into atoms and molecules (for now), I will later expand on these as I need to. Atoms are the most basic building blocks (like buttons, form inputs, etc.). Molecules combine atoms together to form useful UI elements that server a purpose (e.g. a form that comprises form inputs and buttons)
This design system is built off Tailwind CSS.
Atomslink
Logolink
Typographylink
Inter is the display font I'm using, it's a very popular font at the moment. In the future I might look at something more uncommon to add some individuality.
JetBrains Mono is the monospace font.
Almost before we knew it, we had left the ground. | |
Almost before we knew it, we had left the ground. | |
Almost before we knew it, we had left the ground. | |
Almost before we knew it, we had left the ground. | |
Almost before we knew it, we had left the ground. |
Iconographylink
Material Symbols is used for icons.
Panellink
Panels are used for storing content