Generate High-Converting Landing Pages

Landing Page Generator turns a product description into complete Next.js and React landing pages styled with Tailwind CSS. It is by alirezarezvani and produces actual copy rather than lorem ipsum: TSX components, Tailwind styles, SEO meta and copy variants. It applies the PAS, AIDA and BAB copywriting frameworks and targets Core Web Vitals of LCP under 1s, CLS under 0.1 and FID under 100ms.

Its core capabilities are five hero variants (centered, split, gradient, video background, minimal), feature sections (grid, alternating, cards with icons), pricing tables with 2 to 4 tiers and a toggle, an FAQ accordion with schema markup, testimonials (grid, carousel, single quote), CTA sections (banner, full-page, inline), footers (simple, mega, minimal) and four design styles with Tailwind class sets: Dark SaaS, Clean Minimal, Bold Startup and Enterprise.

The generation workflow has seven ordered steps. Gather inputs, asking only for missing fields. Optionally analyze brand voice with the brand_voice_analyzer.py script, which maps formal and professional voice to the enterprise style with AIDA, casual and friendly to bold-startup with BAB, professional and authoritative to dark-saas with PAS, and casual and conversational to clean-minimal with BAB. Select a design style, apply a copy framework before generating components, generate sections in order (Hero, Features, Pricing, FAQ, Testimonials, CTA, Footer, skipping irrelevant ones), validate against the SEO checklist, and output copy-paste-ready TSX files.

Use it when you need a marketing landing page in Next.js or React, when the task involves conversion-focused structure, section variants, Tailwind styling or SEO-aware copy, and when you want a complete page from a product description rather than isolated UI fragments. Its limitations say to use it only when the task clearly matches its scope and to ask for clarification when inputs are missing.

The common pitfalls it lists are useful boundaries: a hero image that is not preloaded, missing mobile breakpoints, vague CTA copy ("Start free trial" beats "Sign up", and "Get started" beats "Learn more"), a pricing section without trust signals and no above-the-fold CTA on a 375px mobile viewport.

The input is filled in with a fixed trigger format:

Product: [name]
Tagline: [one sentence value prop]
Target audience: [who they are]
Key pain point: [what problem you solve]
Key benefit: [primary outcome]
Pricing tiers: [free/pro/enterprise or describe]
Design style: dark-saas | clean-minimal | bold-startup | enterprise
Copy framework: PAS | AIDA | BAB

The output is TSX components with Tailwind classes, SEO meta and structured data. The skill includes a representative centered gradient hero for Dark SaaS as the template for other hero variants, and patterns for alternating feature sections, pricing tables with a highlighted plan, and FAQPage JSON-LD.

The SEO checklist covers title tag (50 to 60 characters), meta description (150 to 160), a 1200 by 630 OG image, one H1 with the primary keyword, structured data, canonical URL, image alt text, robots.txt and sitemap.xml, Core Web Vitals, viewport tag and internal links. The performance targets are LCP under 1s, CLS under 0.1, FID or INP under 100ms, TTFB under 200ms and under 100KB of JS.

It builds on Next.js, React, Tailwind CSS, shadcn Accordion and Next/Image. Related skills are Brand Voice Analyzer, UI Design System for design tokens, and Competitive Teardown for positioning.

It is for founders, marketers and front-end developers who need a conversion-focused, SEO-aware landing page quickly, with copy and components generated together.