Library
Design
01Design

Clarity over convention

One decision per screen — not the usual trading-dashboard noise.

Most trading apps look the same: dozens of panels, every metric shouting at once. We built differently.

One screen, one job

Each view answers a single question — what's important right now, what can wait, what comes next. Everything else steps back.

You shouldn't have to hunt for the action. The layout should point you there on first look.

02Design

The color of meaning

Green and red mean trading — never decoration or generic success.

On a trading screen, color is information — not flair.

The rule

Green means long. Red means short. Bid, ask, gain, loss — that's it. We never use them for a generic "saved" toast or an "active" tab.

When a color appears, you know exactly what it's telling you.

03Design

One system, three places

Design file, written specs, and code — updated together, always.

Our design lives in three places: the design file, the written specs, and the code. They are one system, not three opinions.

How we keep it honest

Change a button style? Update all three in the same pull request. Let them drift and the product starts contradicting itself — a button here, a different one there.

Consistency isn't a phase. It's how a small team keeps a large product coherent.

04Design

Every element earns its place

Nothing is accidental — every control exists to help you act.

A button isn't there because a component library included one. A label isn't short because dashboards are supposed to be dense. Every piece is placed, sized, and worded for the decision you're making in that moment.

Less to read, faster to act

The hierarchy tells you what matters. Spacing groups what belongs together. Copy says the thing directly — no jargon between you and the action.

If an element doesn't help you decide, it doesn't ship.