Pixloop Design.md
MeshConnect homepage design, full-page screenshot

MeshConnect

A bold, fintech-grade crypto-payments interface built on a warm light-gray canvas (#efeeee) with pure-black ink, sharp-cornered black CTAs, and a single high-voltage chartreuse-yellow accent (#f9ff4d). The system reads as confident infrastructure software — oversized Stabilgrotesk display headlines set tight (line-heights below 1.0), near-square radii (2-3px), flat gray content cards, and alternating black / yellow / light-gray bands. Brand voltage comes from the giant grotesk type and the electric-yellow announcement + CTA moments against an otherwise monochrome surface.

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

Color Palette

Accent

Neutrals

Typography

h1 72px · 400 · 0.95
The quick brown fox jumps
h2 64px · 400 · 0.92
The quick brown fox jumps
h3 28px · 400 · 1.071
The quick brown fox jumps
body 18px · 400 · 1.25
The quick brown fox jumps
button 14px · 400 · 1.086
The quick brown fox jumps

Spacing & Shape

Spacing

Name Value Preview
xxs 4px
xs 8px
sm 12px
md 16px
lg 20px
xl 24px
xxl 30px
huge 40px

Border Radius

Name Value Preview
none 0px
xs 2px
sm 3px
pill 100px

FAQ

What colors does MeshConnect use?
MeshConnect's core palette includes #000000, #000000, #0f0f0f, #333333, #545464. The full color set with usage roles (canvas, ink, surfaces, accent, semantic) is documented in the MeshConnect DESIGN.md.
What font does MeshConnect use?
MeshConnect's primary typeface is Stabilgrotesk. 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 MeshConnect design system?
A bold, fintech-grade crypto-payments interface built on a warm light-gray canvas (#efeeee) with pure-black ink, sharp-cornered black CTAs, and a single high-voltage chartreuse-yellow accent (#f9ff4d…

More like this