Pixloop Design.md
Browser-Use homepage design, full-page screenshot

Browser-Use

A near-black developer-infrastructure interface where AI-agent tooling is presented with editorial confidence — a deep #09090b canvas, a single high-voltage orange CTA, and oversized Playfair Display serif headlines that mix roman and italic. The system reads as a precise, terminal-flavored product page: monochrome zinc text on black, code/terminal fragments shown as content, and orange reserved almost exclusively for the primary action.

Works with Claude Code·Cursor·Codex·Gemini CLI·Copilot·v0·Lovable·Bolt·Windsurf·Replit
loading…

Color Palette

Accent

Neutrals

Typography

display-xl 60px · 400 · 1.0
The quick brown fox jumps
display-lg 48px · 400 · 1.0
The quick brown fox jumps
label-serif 14px · 400 · 1.429
The quick brown fox jumps
wordmark 16px · 400 · 1.0
The quick brown fox jumps
body 16px · 400 · 1.5
The quick brown fox jumps
button 13px · 400 · 1.5
The quick brown fox jumps

Spacing & Shape

Spacing

Name Value Preview
xxs 4px
xs 8px
sm 12px
md 16px
lg 20px
xl 24px
xxl 32px
section 64px
section-lg 128px

Border Radius

Name Value Preview
none 0px
sm 4px
pill 9999px
full 9999px

FAQ

What colors does Browser-Use use?
Browser-Use's core palette includes #fe750e, #fe8f3c, #ffa969, #ffddc5, #512704. The full color set with usage roles (canvas, ink, surfaces, accent, semantic) is documented in the Browser-Use DESIGN.md.
What font does Browser-Use use?
Browser-Use's primary typeface is Playfair Display. The complete type scale (sizes, weights, line-height and letter-spacing per role), with an open substitute where the original is licensed, is documented in the DESIGN.md.
What is the Browser-Use design system?
A near-black developer-infrastructure interface where AI-agent tooling is presented with editorial confidence — a deep #09090b canvas, a single high-voltage orange CTA, and oversized Playfair Display…

More like this