Pixloop Design.md
Stack-Auth homepage design, full-page screenshot

Stack-Auth

A developer-first authentication product surface rendered almost entirely in near-black dark mode (#131316 canvas) with crisp white headlines in Geist Sans, an indigo-violet accent spectrum (#6b5df7 family), and inverted white pill CTAs. The system reads as precise modern-dev-tooling — code windows shown in-card, generous vertical rhythm, rounded-pill buttons, and a faint cool-toned glow lighting the hero. Brand voltage comes from the violet/blue accent gradient prism and from real product UI fragments shown inside dark cards.

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

Color Palette

Accent

Neutrals

Typography

display-xl 72px · 600 · 1.0
The quick brown fox jumps
display-lg 48px · 600 · 1.0
The quick brown fox jumps
title 18px · 500 · 1.556
The quick brown fox jumps
body 14px · 400 · 1.429
The quick brown fox jumps
button 16px · 400 · 1.5
The quick brown fox jumps

Spacing & Shape

Spacing

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

Border Radius

Name Value Preview
xs 4px
sm 6px
md 8px
lg 12px
xl 16px
pill 9999px
full 9999px

FAQ

What colors does Stack-Auth use?
Stack-Auth's core palette includes #ffffff, #a0a0ab, #aeaeb6, #9e9ea8, #e4e4e7. The full color set with usage roles (canvas, ink, surfaces, accent, semantic) is documented in the Stack-Auth DESIGN.md.
What font does Stack-Auth use?
Stack-Auth's primary typeface is Geist Sans. 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 Stack-Auth design system?
A developer-first authentication product surface rendered almost entirely in near-black dark mode (#131316 canvas) with crisp white headlines in Geist Sans, an indigo-violet accent spectrum (#6b5df7…

More like this