CupidBox Premium Dark Landing Page

CupidBox is a premium dark-themed landing page design featuring a deep navy and black color palette (#0f0d13) with vibrant purple accents (#8c52ff). It utilizes editorial typography with a pairing of Clash Display for bold headlines and DM Sans for clean body text. The layout is structured with a high-impact hero section containing floating 3D phone mockups, followed by glassmorphic cards, editorial theme grids, and an accordion-style FAQ. This design is ideal for high-end SaaS, creative agencies, digital gifting platforms, or fintech applications that require a sophisticated, modern, and trustworthy aesthetic with subtle glassmorphism and smooth micro-interactions.

CupidBox Premium Dark Landing Page preview

Summary

A high-end, premium dark landing page with a deep navy background, vibrant purple CTAs, editorial typography, and floating 3D layered mockups. It features glassmorphism card components and smooth scroll-triggered-style transitions.

Style

The style is 'Premium Dark Editorial' characterized by high-contrast white text on a deep navy background (#0f0d13). Primary accent is a vibrant purple (#8c52ff) used for buttons and active states. Typography uses 'Clash Display' (Bold) for a boutique, editorial feel and 'DM Sans' for readability. Key visual elements include 12px blur glassmorphism, 24px-48px border radii, and soft background glows in purple and rose tones.

Layout & Structure

A vertical scrolling landing page with a fixed navigation, hero section with product visualization, horizontal stats bar, 3-column feature grid, editorial theme showcase, and a centered FAQ accordion.

Navigation

Hero Section

Stats Bar

Features Grid

Editorial Themes

FAQ

Components

Floating Phone Stack

Three layered smartphone frames that animate vertically at different intervals.

Theme Swatch Row

A specific UI pattern for showing a color palette.

Special Notes

Must maintain high contrast between text and background. Must use the exact background color #0f0d13 to ensure depth. Do not use standard squares; all corners must have a minimum of 12px radius, with main cards at 24px and buttons at full round. Background glow effects (purple/rose) must be very subtle (blur 120px+) to avoid looking messy.

Use this prompt