Landing Page Prompts

Create a high-converting SaaS landing page with these sections: **Hero Section:** - Bold headline with value proposition (max 8 words) - Subheadline explaining the benefit (1-2 sentences) - Primary CTA button: "Start Free Trial" + secondary: "See Demo" - Hero image/screenshot placeholder - Social proof: "Trusted by 10,000+ teams" **Features Section:** - 3-column grid with icons - Feature 1: [Your main feature] - Feature 2: [Secondary feature] - Feature 3: [Third feature] **Pricing Section:** - 3 tiers: Starter / Pro / Enterprise - Monthly/Annual toggle (20% discount) - Feature comparison list - Most popular badge on middle tier **Testimonials:** - 3 testimonial cards with avatar, name, company, quote **FAQ Section:** - 6 common questions with accordion expand/collapse **Footer CTA:** - "Ready to get started?" with email capture Design: Clean, white background, one accent color. Conversion-optimized layout.

Design a pricing page with: **Toggle:** - Monthly / Annual switch (animated) - Show "Save 20%" badge on Annual - Smooth price transition animation **3 Pricing Cards:** - Starter: $29/mo ($23/mo annual) - 5 projects, 10GB storage, Email support - Pro: $79/mo ($63/mo annual) — HIGHLIGHTED as most popular - Unlimited projects, 100GB storage, Priority support, API access - Enterprise: $199/mo ($159/mo annual) - Everything in Pro, Unlimited storage, Dedicated support, SSO, SLA **Each Card:** - Plan name at top - Price with /mo or /year - List of features with checkmarks - CTA button (outline for Starter, filled for Pro, outline for Enterprise) - "Most popular" ribbon on Pro **Bottom:** - "Frequently asked questions" link - "Need a custom plan?" contact link Use clean, modern design. One accent color. Shadow on hover.

Create a testimonial section: **Layout:** - Section title: "What our customers say" - Subtitle: "Join 10,000+ teams already using [AppName]" - 3-column grid of testimonial cards on desktop - Horizontal scroll carousel on mobile **Testimonial Card:** - Customer photo (circle, 56px) - Quote text (italic, 16px) - Customer name (bold) - Company name + logo - Star rating (5 stars) **Features:** - Auto-rotate every 5 seconds - Dot indicators at bottom - Pause on hover - Left/right arrow buttons - Smooth slide animation **Design:** - Light gray background (#F8F9FA) - Cards have subtle shadow - Avatar with green verified checkmark Include 6 sample testimonials with varied companies and use cases.

Build an FAQ accordion: **Structure:** - Title: "Frequently Asked Questions" - 8 questions with expand/collapse **Questions:** 1. "How does the free trial work?" 2. "Can I cancel anytime?" 3. "What payment methods do you accept?" 4. "Do you offer refunds?" 5. "Is my data secure?" 6. "Can I switch plans later?" 7. "Do you offer enterprise pricing?" 8. "How do I contact support?" **Behavior:** - Click question → expand answer with smooth animation - Only one open at a time (accordion style) - Plus icon rotates to X when open - Answer text is 15px, line-height 1.7 **Design:** - Clean divider lines between items - Subtle hover state on questions - Answers have slightly different background Include realistic, helpful answers for a SaaS product.

Create a hero section with: **Animated Background:** - Slow-moving gradient mesh (purple → blue → teal) - Subtle floating shapes/orbs - Low opacity so text is readable **Content (centered):** - Eyebrow text: "🚀 Now in public beta" - Main headline: "Build [X] 10x faster with AI" - Subheadline: "The all-in-one platform for [your use case]. No coding required." - Two buttons: "Start Free" (filled), "Watch Demo" (outline) - "No credit card required" small text below **Social Proof Bar:** - "Trusted by teams at" text - 5 company logos (grayscale, horizontal row) - Logos should be placeholder SVG rectangles **Bottom:** - Scroll indicator arrow bouncing gently **Typography:** - Headline: 56px, bold, letter-spacing -1px - Subheadline: 20px, lighter color - Use Inter or similar clean font Responsive: Stack vertically on mobile, reduce font sizes.