Ethereal Fintech Grid

The composition is structured around an asymmetrical three-card CTA cluster set against an ultra-pale lavender canvas (#F8F9FE), abruptly anchored by a high-contrast dark navy footer card (#0B132B). Color is used intentionally to guide hierarchy: saturated periwinkle-purple (#4F46E5 to #5B4BF0) commands primary actions, while smooth peach-to-pink gradients (#FB7185 to #F43F5E) provide warm focal accents in typography and chart illustrations. The typography relies on a clean, humanist geometric sans-serif, using weight contrasts (from 400 regular body text to 700 bold display titles) rather than scale alone. Spacing adheres to an 8px grid with generous 24px gaps and 24px rounded card surfaces that exhibit subtle borders (#E5E7EB) and near-zero drop shadow. A reader notices the iridescent gradient headline ('Global Bank Account') and the glowing globe watermark before descending into the dense multi-column dark footer.

1 design references

Prompt metadata
Shared by	@Devault
Model	GPT Image 2.5
Category	Pricing & calls to action
Dataset	stretchcloud · awesome-gpt-image-prompt-2.5

The prompt

Design a light-mode website section: luminous lavender light-mode cards floating cleanly above a deep navy command-center footer.

LAYOUT
The top CTA zone utilizes an asymmetrical 2-column grid: a dominant 7-column wide hero card on the left containing the primary headline and trust chips, and two vertically stacked 5-column feature cards on the right. Directly below, separated by a 32px vertical gap, sits a unified wide dark card holding an 8-column footer with company bio, structured nav links, compliance note, and copyright bar.

PALETTE (use these exact hex values)
- #F8F9FE — Canvas Ice White: Light mode page canvas background providing gentle cool contrast behind white cards
- #FFFFFF — Card Surface Pure White: Primary surface for CTA cards and input backgrounds in light theme
- #0B132B — Midnight Navy Base: Container background for the overarching dark footer component
- #EAEBF4 — Subtle Border Gray: Hairline 1px borders wrapping cards, badge pills, and trust chips
- #4F46E5 — Electric Iris Indigo: Primary button fill, icon circle fills, and lead focal accents
- linear-gradient(90deg, #4F46E5 0%, #7C3AED 50%, #FB7185 100%) — Gradient Indigo Pink: Text clip gradient applied to primary display headline highlight
- #FF7A59 — Warm Peach Coral: Metrics card icon background and line-chart graphic gradient
- #0F172A — Deep Slate Text: High-contrast headings and primary labels in the light theme
- #64748B — Muted Slate Text: Body copy, subheaders, and metadata in light sections
- #94A3B8 — Dark Footer Muted: Navigation links and copyright details within the dark footer

TYPOGRAPHY
Typeface Inter (or Plus Jakarta Sans, SF Pro Display, Roboto), weights 400/500/600/700. Sizes 11px caption, 13px body-sm, 15px body, 18px subheading, 22px heading, 38px display. Tracking -0.03em at display, -0.01em at body, 0.08em for uppercase badges. The type voice is precise, institutional, and distinctly modern fintech—evoking trust and engineering precision like Stripe or Mercury. A tight geometric sans-serif (such as Inter or Plus Jakarta Sans) utilizes tightened letter spacing (-0.03em) on large titles to ensure headlines feel compact and cohesive.

GEOMETRY & SPACING
Corner radii — cards 24px, links 9999px, inputs 10px, buttons 12px. Spacing on a 8px unit, 20px gaps, 48px between sections, 1240px container, comfortable density.

DEPTH
Depth is rendered flat-editorial style with almost no perceptible drop shadows. Distinction between surfaces is achieved exclusively via hairline borders (1px solid #EAEBF4) and slight background contrast against the #F8F9FE canvas. The dark footer achieves depth through high-contrast figure-ground opposition.

IMAGERY
Visual assets consist of schematic vector illustrations: an ethereal purple wireframe globe network, a minimalist dotted world map, and an upward trending smooth peach line chart with semi-transparent area fill. Photography is completely avoided in favor of crisp financial diagrams and vector badges.

SIGNATURE DETAIL — the thing that makes this design itself
The distinctive move is the contrast between the airy white-and-lavender CTA card cluster and the unified obsidian navy footer card docked directly underneath. This structure provides high-conversion lightness at the focal interaction point while grounding the page with enterprise financial authority.

MUST
- Retain generous 24px border radii on all major interactive and presentation cards.
- Pair deep slate primary text (#0F172A) with cool gray secondary text (#64748B) for crisp typographic hierarchy.
- Use delicate gradient wireframes and muted line illustrations rather than solid photos in feature panels.
- Apply gradient typography exclusively to the concluding focal words of main display headings.

AVOID
- Do not use sharp 0px or small 4px border corners on primary surfaces.
- Never apply harsh black (#000000) drop shadows; keep elevation flat or softly tinted.
- Avoid using saturated background fills for entire CTA cards; retain bright #FFFFFF.
- Do not set footer text to pure white (#FFFFFF); use muted slate (#94A3B8) to prevent glare.

OUTPUT
Render as a clean, pixel-crisp UI design at roughly 1792:1024. Flat vector rendering, real legible text, no browser chrome, no device mockup frame, no watermark, no lorem ipsum placeholder blocks.

Try in DraPub

More prompts from the same visual neighborhood.

Back to prompt gallery

Pricing & calls to actionDesign reference

Abyssal Biofoundry

The canvas is anchored on an ultra-dark navy-black surface (#02050b) layered with a luminous horizon glow dividing the primary call-to-action from the structural site directory. Typography relies on a neutral neo-grotesque sans-serif rendered in pure white (#f8fafc) for high-impact display titles (48px) and a soft slate-blue (#94a3b8) for secondary narrative and navigational text. Vibrant electric blue (#1d6bf3) functions as the concentrated action color, isolated to high-intent pill tags, primary action triggers, and glowing vector iconography. Compact cards and inline code snippets utilize a slightly elevated surface (#070d18) with disciplined 1px borders (#162238) and subtle 8px to 12px border radii. A reader immediately registers the luminous horizontal seam at the fold, drawing the eye directly to high-trust credentials before descending into developer-grade utility.

Pricing & calls to actionDesign reference

Abyssal Defense

Built on an impenetrable canvas of deep void navy (#090d14), this interface uses darkness not as absence of light, but as an operational deep-sea medium. Color is deployed with surgical discipline: primary calls-to-action ignite in a radiant periwinkle-to-indigo gradient (#4f46e5 to #6366f1) while operational indicators flash a restrained coral-orange (#fb7185) against slate neutrals. The primary visual weight is anchored by an expansive 24px-radius CTA panel housing an autonomous submarine render sliced by a conical cyan spotlight. Typography balances a towering condensed grotesque wordmark in the footer with clinical, hyper-legible neo-grotesque sans-serif in the CTA lockup. Structural dividers and social pill buttons use faint 1px hairline borders (#1e293b) to define boundaries without interrupting the nocturnal continuity. Inline spacing is generous, keeping legal and navigational tiers legible and calm.

Pricing & calls to actionDesign reference

Abyssal Defense Matrix

The canvas is set on an ultra-dark navy surface (#030712 to #050b14) evocative of the deep ocean, establishing a high-stakes maritime defense atmosphere. Color is utilized strictly for status and strategic hierarchy: electric blue (#2563EB to #38BDF8) demarcates autonomous superiority, while muted red (#DC2626) badges identify legacy vulnerabilities against neutral slate typography. Primary typography is a clean, neo-grotesque sans-serif with tracked uppercase badges and sharp header contrast (44px display down to 11px micro-labels). Shapes rely on subtle rounded cards (radius: 16px) with hairline semi-transparent borders (#1E293B) and glassmorphic translucent fills. A reader immediately notices the highlighted autonomous column encased in a vibrant glowing blue frame beside an illuminated stealth submarine.

Pricing & calls to actionDesign reference

Aerospace Dark Spec

This interface pairs deep abyssal navy canvas (#040911) with electric cybernetic cyan accents (#19E0B2) to deliver a high-assurance defense and aerospace identity. The layout organizes a prominent enterprise conversion banner directly above a dense, multi-column navigation footer. A glowing 3D particle landscape wave acts as an atmospheric horizon separator between the CTA area and footer columns. Visual weight relies on bold, clean geometric display typography (around 44px) paired with sharp tabular figures (32px) and translucent glassmorphism cards framed by subtle semi-transparent borders (rgba(255,255,255,0.08)). Subtle cyan micro-accents highlight key conversion triggers like the primary booking button, monospaced eyebrow trackers, and inline trust indicators.