Design a dark-mode website section: deep blue telemetry framing illuminated tier matrices under soft atmospheric glow.
LAYOUT
The page adheres to a centered single-column stack. It begins with a centered meta pill, followed by a bold display headline, secondary description, and the billing toggle switch. Below rests the core monolith 5-column comparison grid (1 feature title column plus 4 tier columns), concluded with an autonomous horizontal trust dock spanning the full container width.
PALETTE (use these exact hex values)
- #020612 — Void Canvas: Deepest canvas background behind all matrices and radial glows
- #060D1E — Panel Surface: Base fill color for matrix columns and bottom metric bars
- #101B33 — Subtle Outline: Grid column separators, card borders, and inactive row dividers
- #2563EB — Electric Cobalt: Primary CTA button fill, highlighted column outline, and pill accents
- #1D4ED8 — Vibrant Blue Tint: Active toggle background and badge highlight fill
- #FFFFFF — Text Pure White: Display headline, plan titles, pricing figures, and prominent CTAs
- #8493A8 — Muted Slate Text: Subheadlines, billing frequencies, row labels, and feature specifications
- #3B82F6 — Faint Icon Blue: Metric badge circular backdrops, active checkmarks, and category pill text
- #10B981 — Soft Mint Success: Green accent on feature guarantees and 'Save 20%' savings indicator
TYPOGRAPHY
Typeface Inter (or Plus Jakarta Sans,SF Pro Display,Geist), weights 400/500/600/700. Sizes 11px caption, 12px body-sm, 14px body, 16px body-lg, 18px subheading, 22px heading, 36px heading-lg, 48px display. Tracking -0.02em at display, 0 at body. The typography is strictly rationalist, clean, and modern, typified by Inter or SF Pro Display. Tight negative tracking on large headings (-0.03em) prevents sprawling, while tabular numbers and precise geometric capitals provide enterprise SaaS credibility. Standard weights (400, 500, 700) suffice across all roles without requiring idiosyncratic serif accents.
GEOMETRY & SPACING
Corner radii — cards 16px, links 4px, inputs 8px, buttons 8px. Spacing on a 4px unit, 16px gaps, 80px between sections, 1200px container, comfortable density.
DEPTH
Depth is created entirely through color saturation and ambient illumination rather than drop shadows. The background glow subtly illuminates the center tier, while the highlighted card features a glowing 1.5px royal blue border that visually pulls it 10-15% closer to the user than adjacent muted columns.
IMAGERY
There is no photographic or vector illustration imagery present. Visual interest is driven exclusively by minimal linear iconography (headset, phone, calendar, shield) set inside 36px circular badges or alongside list titles.
SIGNATURE DETAIL — the thing that makes this design itself
The integrated 5-column dark monolith grid where the recommended plan is cleanly 'sleeved' in a neon blue border that slightly overflows the top edge, capped with an integrated 'MOST POPULAR' pill badge. Losing this sleeve turns the layout into an undifferentiated spread of dark data.
MUST
- Keep the entire comparison matrix unified inside a shared dark surface container rather than floating individual card panels.
- Use exactly one primary solid blue action button across the matrix to maintain undeniable conversion hierarchy.
- Align all feature row lines precisely across label and pricing columns with 44px uniform row heights.
- Display quantitative limits (e.g., 'Up to 1,000 contacts/mo') in light slate (#8493A8) rather than harsh pure white.
AVOID
- Do not separate tiers into independently spaced floating cards; they must read as an integrated grid.
- Do not use high-contrast white text for table gridlines or secondary metric subtitles.
- Never apply multiple bright button fills across alternative tiers; all other CTAs must remain low-contrast dark pills.
- Do not omit the radial ambient light source centered directly above the highlighted column.
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. 在 DraPub 中尝试 
