Create your Lumen account — centered card (cobalt)

Summary

A centered single-column signup card on a light slate canvas, with a sticky blurred top nav, social-auth buttons (Google, GitHub), an OR divider, an email + password form, a cobalt primary CTA, and a quiet engineering grid background with subtle floating decorative chips. Warm, trustworthy SaaS aesthetic in the Resend/Linear lineage.

Style

Clean, modern SaaS auth aesthetic: near-white slate canvas (#f8fafc), Inter typeface, cobalt-blue accent (#2563eb), soft rounded cards with layered low-opacity shadows, hairline slate borders, and a faint masked engineering grid for texture. High polish, low noise.

Layout & Structure

Full-height flex column: a 64px sticky top nav, then a full-bleed main canvas that vertically centers a 420px-max signup column. The column stacks a logo+heading block, the white card (social buttons, OR divider, form, reassurance line), and a legal footnote below the card.

Sticky top nav

Canvas + decorative background

Centered signup column

Logo + heading block

Card shell

Social auth row

OR divider

Email + password form

Reassurance + legal footnote

Special Notes

Tailwind (CDN) with a custom 'cobalt' color scale (50 #eff4ff → 600 #2563eb → 700 #1d4fd0 → 950 #172554) and three named shadows (card, softbtn, cobalt). Inter loaded from Google Fonts; icons from Iconify (lucide + logos sets). Single accent hue (cobalt) over a slate neutral system; everything else is restraint. Responsive: nav links and floating chips hide on small screens, social buttons stack to 1 column below sm, and the card stays a fixed 420px max-width centered column. The look intentionally mirrors developer-tool auth screens (Resend / Linear) where the form is the hero and the background is quiet texture, not decoration.