MVXMXM

Design System (WIP)

Color

Typography

Display48px · sanshero titles
Form follows functionality.
H140px · sans
Form follows functionality.
H228px · sans
Section heading
Body16px · sansline-height 1.75
The quick brown fox jumps over the lazy dog.
Handwritten accent20px · handwrittendates, eyebrows, labels
words by maximillian
Mono14px · monocode only
const tokens = true

Components

Button

Input

Card

Chat

Show me your work on AI interfaces.

Let’s find a relevant case study for you.

When Words Cannot Describe

In this article for Smashing Magazine, I write about how Artificial Intelligence is evolving the computing paradigm, letting designers craft more intuitive user interfaces.

ColorTypographyComponentsLogoNav barMenu

Radius

Soft, generous corners. Pills (40px) for floating chrome, large radii for cards.

Chip / input
6px
Code / small
8px
Card
16px
Card (folio)
24px
Hero card
36px
Pill
40px

Motion

Almost everything eases between 0.2s and 0.5s. FolioEngine uses 0.35s ease as its house transition; text effects use cubic-bezier(0.4, 0, 0.2, 1). Motion is built on framer-motion via the registry/ primitives below — prefer those over hand-rolled keyframes.

  • Standard transition: all 0.35s ease
  • Quick (hover/opacity): 0.2s ease
  • Easing curve: cubic-bezier(0.4, 0, 0.2, 1)