Prismline — Aurora Glass: Ship a SaaS Site That Looks Designed, Not Generated

Summary

Build a premium dark glassmorphic SaaS marketing site for 'Prismline' on a near-black page (#0b0f14) lit by soft aqua-to-magenta aurora blobs. A sticky frosted-glass pill nav floats over a centered hero with duotone gradient text, a floating frosted dashboard-canvas mockup, a logo strip, a 6-card feature grid, a bento showcase, a 3-tier pricing block with a featured Pro plan, a big glass CTA, and a 5-column glass footer.

Style

Dark aurora-glass aesthetic: a single near-black canvas under soft, blurred aqua and magenta light fields, with frosted translucent panels, hairline borders, and duotone aqua-to-magenta gradient accents on headings, badges and buttons. Premium, luminous, restrained: glass surfaces never go opaque, accents stay in the aqua/cyan/magenta family only (no generic indigo or violet).

Layout & Structure

A single full-width responsive marketing page, max-w-6xl centered container with px-5/px-6, stacked sections separated by generous top padding (pt-24 / sm:pt-32). Sticky glass pill nav at top, centered hero with a floating mockup, then features, bento showcase, pricing, CTA, and footer. Reflows from a 12-col desktop grid down to single-column at 390px.

Global background

Sticky nav

Hero

Floating dashboard mockup

Logo strip

Feature grid

Bento showcase

Pricing

CTA band

Footer

Responsive reflow

Special Notes

Keep accents strictly in the aqua / aqua-soft / cyan / magenta family on the near-black #0b0f14 base; do not introduce generic indigo or violet AI-slop gradients. Glass panels must stay translucent (backdrop-blur) with 1px hairline borders, never solid fills. All gradient-on-dark text and white/xx body copy must remain WCAG-legible. Load Space Grotesk + Inter from Google Fonts and Phosphor icons via iconify. No em-dashes in any copy. Render the full page faithfully with responsive rules at 1280 / 768 / 390.