Design a dark-mode website section: deep abyssal teal meeting fluted emerald radiance, grounded by energetic orange action prompts and meticulous micro-navigation.
LAYOUT
Structured in two distinct stacked master zones. Top zone: a centered single-column CTA hero section (~360px vertical height) with ample negative space around a two-line headline, subtitle, and centered dual-button row. Bottom zone: a structured 1280px wide container housing a 6-column grid (brand summary, 4 link lists, 1 newsletter module), terminated by a simple bottom metadata strip.
PALETTE (use these exact hex values)
- #041b1e — Abyssal Ground: solid background canvas for the entire structured footer area and form inputs
- #08332f — Fluted Deep Pine: deep structural under-layer of the CTA hero backdrop with vertical textural lines
- #6be0af — Aurora Glow: ambient radial diffusion light beneath the CTA copy and highlight keyword tint
- #f2722b — Ember Spark: exclusive high-visibility fill for the primary CTA button
- #6ee7b7 — Mint Glaze: accent color for submission button, logo facets, and keyword emphasis
- #ffffff — Starlight White: primary text for main heading, footer column headings, and logo mark label
- #8ba4a2 — Teal Muted Slate: secondary body descriptions, legal metadata, and navigational sub-links
- #0e3a3d — Borealis Border: structural outline for newsletter text inputs, social icon buttons, and divider rules
TYPOGRAPHY
Typeface Plus Jakarta Sans (or Geist Sans, Inter, DM Sans), weights 400/500/600/700. Sizes 12px caption, 14px body-sm, 15px body, 16px subheading, 20px heading, 44px display. Tracking -0.025em at display, -0.01em at body, 0.02em at caps. The voice is architectural, technological, and restrained. Plus Jakarta Sans or Geist Sans yields a modern Swiss precision that strips away marketing fluff and presents the platform as a developer-grade instrument, while careful letterspacing tweaks prevent display sizes from feeling loose.
GEOMETRY & SPACING
Corner radii — cards 0px, links 4px, inputs 8px, buttons 8px. Spacing on a 8px unit, 24px gaps, 96px between sections, 1280px container, comfortable density.
DEPTH
Depth is created purely through luminous chromatic projection rather than shadow drops. The upper section relies on a background radial bloom filtered through vertical fluting to simulate internal radiance, while the lower section is deliberately flat and grounding, anchoring the page with zero z-axis elevation on cards or links.
IMAGERY
No photographic imagery is present. Visual interest is driven by abstract synthetic radiance: a vertical fluted-glass or pleated-curtain texture modulated by a core lime-cyan aurora illumination, complemented by an isometric layered gem icon in the logo lockup.
SIGNATURE DETAIL — the thing that makes this design itself
The dual signature consists of the fluted vertical aurora glow behind the CTA paired with the sudden, solitary punctuation of an ember-orange primary button. Misusing this means dispersing the orange accent into secondary links or over-saturating the entire footer with green glows instead of confining it to the hero.
MUST
- Reserve ember orange (#f2722b) strictly for the primary conversion button to maintain visual hierarchy.
- Prefix secondary text navigation items with the single-character chevron '>' for systematic scannability.
- Retain the sharp tonal cut between the luminous fluted banner above and the solid matte dark footer.
- Use geometric sans-serif type with snug negative tracking on titles above 32px.
AVOID
- Do not introduce bright saturated warm colors anywhere in the footer navigation or body text.
- Do not add drop shadows to navigation links or footer column headers; keep typography flat.
- Never replace the chevron prefix with standard bullet dots or custom decorative icons in link lists.
- Avoid rounded-full pill styling on inputs; stick to strict 8px rectangular radii.
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 中尝试 
