Systems that bend, not break
A good design system is like clay. It holds its shape, but it moulds to the situation, the screen and the person using it. These are the Figma features that make mine bend.
- Variants
- Slots
- Variables
- Prototyping
- 231Variables
- 7Modes: light and dark, three screen sizes, two accents
- 53Components
Built to bend
Six features, each one there to make the interface fit the person using it, not the other way around.
One card, any content
Slots let the same card hold an image, a phone screen or an illustration. I build it once and reuse it everywhere.
One component, many moods
Variants hold desktop and mobile, light and dark, all in one card. Pick the version and the layout follows.
Your screen, your way
Some people prefer dark mode. Light and dark run on the same variables, so the whole site switches in one click.
Type that fits the screen
Headings grow and shrink with the screen, so reading on a phone feels as good as on a laptop.
Small things that feel alive
A hover that grows a little, a clay button that squishes when pressed. Tiny cues that say yes, you can click this.
Room for a highlight
A carousel to show off a product or a feature, on desktop and mobile alike.
Still being shaped
Building this portfolio wasn’t the easiest project I’ve done. Showing what you can do, and who you want to be, makes you question every decision. In the end it shows where I am today, and like clay, it isn’t done being shaped.
The library is my starting point for every new project. The tokens, modes and variables are already in place, so it grows as I grow.