Agent skill · marketing growth · alirezarezvani
landing-page-generator
Use when asked for a landing, marketing or campaign page as a Next.js TSX component with Tailwind. Scaffolds it with landing_page_scaffolder.py using PAS, AIDA or BAB copy, SEO meta and Core Web Vitals targets.
Why this skill is useful
Generates complete TSX components with Tailwind CSS and SEO optimizations, providing executable code that enhances landing page creation capabilities.
What it needs
Requires next, react, tailwindcss installed locally. About 6k tokens when loaded. Last updated 2026-08-05. 23,939 stars on the source repository.
What this skill does
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/skills/content-production/scripts/brandvoiceanalyzer.py to get a voice profile (formality, tone, perspective). Use the profile to inform design style and copy framework selection: formal + professional → enterprise style, AIDA framework casual + friendly → bold-startup style, BAB framework professional + authoritative → dark-saas style, PAS framework casual + conversational → clean-minimal style, BAB framework 3. Select design style — map the user's choice (or infer from brand voice analysis) to one of the four Tailwind class sets in the Design Style Reference. 4. Apply copy framework — write all headline and body copy using the chosen framework (PAS / AIDA / BAB) before generating components. Match the voice profile's formality and tone throughout. 5. …
How to use it
Reference it in AdaL, Claude Code, Cursor or any coding agent — nothing to install:
@skills alirezarezvani/landing-page-generator--ae0b95