Add v0 prompt for Nextra landing page

Detailed prompt for generating the SaaS landing page with Vercel v0.
Includes: hero, features, pricing, testimonials, FAQ, and styling specs.

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
dullfig 2026-01-20 22:09:49 -08:00
parent 2d05fd3656
commit a6cd3ce7e8

View file

@ -0,0 +1,158 @@
# Nextra Landing Page — v0 Prompt
Paste this prompt into Vercel v0 to generate the landing page.
---
Create a complete SaaS landing page for "Nextra" - a visual AI agent workflow builder.
## Brand
- Name: Nextra
- Tagline: "Build AI agent swarms, visually"
- Style: Dark mode (#0a0a0f background), purple/violet primary (#8b5cf6),
subtle gradients, modern SaaS aesthetic like Linear or Vercel
- Font: Inter or Geist Sans
## Hero Section
- Large headline: "Build AI Agent Swarms, Visually"
- Subheadline: "Drag-and-drop workflow builder for AI agents. Connect LLMs,
tools, and custom logic. No code required — but code when you need it."
- Two CTAs: "Start Building Free" (primary, purple) and "Watch Demo" (ghost/outline)
- Hero visual: Abstract representation of connected nodes/flow diagram with
glowing edges, or a stylized screenshot of a flow canvas
- Floating badges: "No credit card required" and "Free tier available"
## Social Proof Bar
- Logos section: "Trusted by teams at" with placeholder company logos (greyed out)
- Or: "Join 1,000+ builders" with avatar stack
## Features Section (6 cards in 2x3 grid)
1. **Visual Flow Builder**
Icon: boxes with connecting lines
"Drag, drop, and connect. Your AI workflow becomes a visual diagram
that anyone can understand."
2. **Multi-LLM Support**
Icon: brain or sparkles
"Connect to Claude, GPT-4, Grok, Llama, or your own models.
Automatic failover keeps your flows running."
3. **Secure Custom Code**
Icon: code brackets with shield
"Write custom logic in sandboxed WebAssembly. Full power, zero risk.
Your code can't escape the sandbox."
4. **Instant Triggers**
Icon: lightning bolt
"Webhooks, schedules, or manual runs. Your agents wake up when you
need them, sleep when you don't."
5. **Marketplace**
Icon: grid of boxes / store
"Browse community tools and templates. Publish your own.
Build once, share everywhere."
6. **Team Ready**
Icon: users
"Enterprise SSO, role-based access, audit logs.
Built for teams that ship."
## How It Works Section (3 steps, horizontal)
Step 1: "Design Your Flow"
- Illustration: Canvas with a few connected nodes
- "Drag blocks from the palette. Connect them visually.
See your YAML config update in real-time."
Step 2: "Configure & Connect"
- Illustration: Settings panel / API key input
- "Add your LLM keys, configure triggers, set up webhooks.
Everything in one place."
Step 3: "Deploy & Scale"
- Illustration: Rocket or cloud with checkmark
- "One click to deploy. Your agents run 24/7 on our infrastructure.
Scale to zero when idle, scale up on demand."
## Pricing Section
Header: "Simple, transparent pricing"
Subheader: "Start free. Scale when you're ready."
3 pricing cards:
**Free** - $0/month
- 1 workflow
- Built-in tools only
- 1,000 runs/month
- Community support
- CTA: "Get Started"
**Pro** - $29/month
- Unlimited workflows
- Marketplace access
- Custom WASM code
- 100,000 runs/month
- Project memory
- Priority support
- CTA: "Start Free Trial" (primary, highlighted card)
**Enterprise** - Custom
- Everything in Pro
- SSO & SAML
- Role-based access
- Dedicated support
- SLA guarantee
- Private marketplace
- CTA: "Contact Sales"
## Code/YAML Preview Section
Header: "Visual builder. YAML under the hood."
Subheader: "See exactly what you're building. Export anytime."
Split view showing:
- Left: Mini canvas with 3-4 connected nodes
- Right: Corresponding YAML code with syntax highlighting
Caption: "What you see is what you get. Power users can edit YAML directly."
## Testimonials Section (3 cards)
Use placeholder testimonials:
"Nextra replaced our entire agent orchestration layer. What took us
weeks to build, we now do in hours."
— Sarah Chen, CTO at [Placeholder]
"Finally, a tool that lets non-engineers build AI workflows without
sacrificing power for our dev team."
— Marcus Johnson, Head of AI at [Placeholder]
"The WASM sandboxing sold us. We can let customers run custom code
without worrying about security."
— Elena Rodriguez, Security Lead at [Placeholder]
## FAQ Section (accordion style)
4-5 questions:
- "What's included in the free tier?"
- "Can I use my own LLM API keys?"
- "How does the WASM sandboxing work?"
- "Can I export my workflows?"
- "Is there an API?"
## Final CTA Section
Header: "Ready to build your first AI swarm?"
Subheader: "Start free. No credit card required. Deploy in minutes."
Large CTA button: "Get Started Free"
Secondary link: "Talk to Sales →"
## Footer
- Logo + tagline
- Columns: Product (Features, Pricing, Docs, Changelog), Company (About, Blog, Careers, Contact), Legal (Privacy, Terms, Security)
- Social icons: Twitter/X, GitHub, Discord
- Copyright: "© 2025 Nextra. All rights reserved."
## Additional Details
- Add subtle grid/dot pattern background in hero
- Use glassmorphism for cards (subtle blur, border)
- Animate elements on scroll (fade up)
- Mobile responsive
- Include dark mode toggle in nav (but default to dark)
- Nav: Logo | Features | Pricing | Docs | Login | "Get Started" button