LAYOUT Typography COLOR Grid System TEXTURE White Space Hierarchy Motion Balance Kerning UI/UX Flow Gestalt Alignment Scale

DESIGN Inspiration

You are the cursor. The code is the ink.

🎨

Draw Mode: OFF

Explore The Vault

Palettes you can actually ship.

Search, filter by industry, switch Light/Dark — pick a palette, everything updates instantly.

▾

Select a palette

Palette + gradients preview lives here.

Typography Lab

Words Carry Structure

Typography is hierarchy, rhythm, and restraint.

SYSTEM NOTE

Authority, then detail

accent

A clean hierarchy that reads fast and feels intentional.

When to use: hero headers

Best for core messaging when you want instant clarity.

Make the point, then underline it.

One highlight word to control attention without drama.

When to use: persuasion lines

Perfect for sections that need a single controlled punch.

BLUEPRINT

Foreground stays readable.

Background word adds depth, not noise.

When to use: manifesto blocks

Use when you want presence without adding extra UI.

INTRO LINE

Big statement.

Small context follows. The rhythm does the work.

When to use: section openings

Strong vertical hierarchy for quick scanning.

Highlight the key phrase, keep the rest calm.

Engraved emphasis: readable, premium, quiet.

When to use: feature callouts

Great for benefits lists and micro-sales sections.

OUTLINE TITLE

A transition moment that stays lightweight.

When to use: section transitions

Adds drama without stealing contrast from content.

ECHO

Depth without gradients. Just typographic layering.

When to use: creative identity

Best when you want a “designed” feel with minimal UI.

Structure with a human tilt

Kirang only as a deliberate accent.

When to use: identity copy

Works well in About / brand voice sections.

Framed statement

Editorial feel with controlled boundaries.

When to use: long-form intros

Use when you want “curated” and calm.

Drop a highlight block

A callout that breathes inside a dark section.

When to use: pivotal moments

Ideal for “key takeaway” lines and section anchors.