← ClaudeAtlas

landing-page-generatorlisted

Generates high-converting landing pages as complete Next.js/React (TSX) components with Tailwind CSS. Creates hero sections, feature grids, pricing tables, FAQ accordions, testimonial blocks, and CTA sections using proven copy frameworks (PAS, AIDA, BAB). Outputs SEO meta tags, structured data, and performance-optimised code targeting Core Web Vitals (LCP < 1s, CLS < 0.1). Use when the user asks to create a landing page, marketing page, homepage, single-page site, lead capture page, campaign page, promo page, or conversion-optimised web page — or when they want to A/B test landing page variants or replace a static page with one designed to convert.
SanctifiedOps/nami-creative-brain-template · ★ 0 · Web & Frontend · score 62
Install: claude install-skill SanctifiedOps/nami-creative-brain-template
# Landing Page Generator Generate high-converting landing pages from a product description. Output complete Next.js/React components with multiple section variants, proven copy frameworks, SEO optimization, and performance-first patterns. Not lorem ipsum — actual copy that converts. **Target:** LCP < 1s · CLS < 0.1 · FID < 100ms **Output:** TSX components + Tailwind styles + SEO meta + copy variants --- ## Core Capabilities - 5 hero section variants (centered, split, gradient, video-bg, minimal) - Feature sections (grid, alternating, cards with icons) - Pricing tables (2–4 tiers with feature lists and toggle) - FAQ accordion with schema markup - Testimonials (grid, carousel, single-quote) - CTA sections (banner, full-page, inline) - Footer (simple, mega, minimal) - 4 design styles with Tailwind class sets --- ## Generation Workflow Follow these steps in order for every landing page request: 1. **Gather inputs** — collect product name, tagline, audience, pain point, key benefit, pricing tiers, design style, and copy framework using the trigger format below. Ask only for missing fields. 2. **Analyze brand voice** (recommended) — if the user has existing brand content (website copy, blog posts, marketing materials), run it through `marketing-skill/content-production/scripts/brand_voice_analyzer.py` to get a voice profile (formality, tone, perspective). Use the profile to inform design style and copy framework selection: - formal + professional → **enterprise** styl