Back to Documentation

Design
System

Digital elegance meets conversion science. Our design system is not just about looks; it's a governed language that ensures consistency and scalability.

Design System Abstract Art

Typography

Display

Instrument Serif

Used for emotive headlines and to inject personality. It carries a classical elegance that contrasts with the modern UI.

Body & UI

Inter Tight

Engineered for screens. High legibility at small sizes, neutral character, perfect for UI components and flexible content.

Color Palette

Deep Black (Luxury)

#050505

Primary background for dark mode, text for light mode.

Traficxo Purple

#8B5CF6 (Example)

Accent color used for primary actions, highlights, and brand moments.

Pure White

#FFFFFF

Clean space, cards, and primary text in dark mode.

Atomic Components

We follow an Atomic Design methodology. This means building from the smallest unit (atoms: buttons, inputs) to molecules (form groups) to organisms (sections). This ensures that if we change the brand color in one place, it propagates instantly across the entire ecosystem.