landing-page

1# Landing Page Generator
2 
3Generate a complete, deployable landing page as a single HTML file. No build step, no dependencies — open it in a browser or deploy anywhere.
4 
5## Workflow
6 
7### 1. Gather the Brief
8 
9Ask the user for:
10 
11| Field | Required | Example |
12|-------|----------|---------|
13| Business/product name | Yes | "Acme Plumbing" |
14| Value proposition | Yes | "24/7 emergency plumbing across Newcastle" |
15| Target audience | Yes | "Homeowners in the Hunter Valley" |
16| Primary CTA | Yes | "Call Now" / "Get a Quote" / "Sign Up" |
17| Secondary CTA | No | "Learn More" / "View Pricing" |
18| Brand colours | No | Primary: #1E40AF, accent: #F59E0B |
19| Logo URL or text | No | URL to logo image, or just use business name |
20| Phone / email | No | For contact section |
21| Sections wanted | No | Default: hero, features, testimonials, FAQ, footer |
22 
23If no brand colours provided, suggest using the `color-palette` skill to generate them, or use a sensible default (slate/blue).
24 
25### 2. Generate the HTML
26 
27Produce a **single HTML file** with:
28 
29```
30<!DOCTYPE html>
31<html lang="en" class="scroll-smooth">
32<head>
33  <!-- Meta, OG tags, favicon -->
34  <script src="https://cdn.tailwindcss.com"></script>
35  <script>tailwind config with custom colours</script>
36</head>
37<body>
38  <!-- Nav -->
39  <!-- Hero -->
40  <!-- Features -->
41  <!-- Social Proof -->
42  <!-- Pricing (optional) -->
43  <!-- FAQ -->
44  <!-- Footer -->
45  <!-- Dark mode toggle script -->
46</body>
47</html>
48```
49 
50### 3. Section Patterns
51 
52#### Navigation
53…