skills.rest
ratnesh-maurya
ratnesh-mauryaCOMMUNITY
Explore all skills by this author →
Website𝕏@_ratneshmauryaGitHub

landing-page-generator

Generates Next.js landing page components with Tailwind CSS and conversion copy frameworks.

1|Updated Dec 29, 2025
Search Tags:#SEO#React#landing page#copywriting#nextjs#conversion#tailwind
One-click install
npx skills add https://github.com/ratnesh-maurya/tracker.ratnesh-maurya.com --skill landing-page-generator-ratnesh-maurya
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: landing-page-generator
Source: https://github.com/ratnesh-maurya/tracker.ratnesh-maurya.com/tree/main/.claude/skills/landing-page-generator
Command: npx skills add https://github.com/ratnesh-maurya/tracker.ratnesh-maurya.com --skill landing-page-generator-ratnesh-maurya

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) and references (resource) components.

What problem does it solve? Writing landing page copy and building responsive marketing sections from scratch is slow and inconsistent, often resulting in vague headlines, missing SEO metadata, and poor Core Web Vitals. ## Core Features & Use Cases - Section Generation: Produces complete TSX components for heroes, features, pricing tables, FAQs with schema markup, testimonials, CTAs, and footers in four design styles (dark-saas, clean-minimal, bold-startup, enterprise). - Copy Frameworks: Applies PAS, AIDA, BAB, and 4Ps frameworks to write conversion-focused headlines and body copy instead of placeholder text. - SEO & Performance Validation: Enforces a checklist covering meta tags, structured data, canonical URLs, and Core Web Vitals targets (LCP < 1s, CLS < 0.1). - Use Case: Provide a product name, tagline, audience, pain point, and pricing tiers, and receive a copy-paste-ready Next.js page with SEO meta and structured data, or run the scaffolder script with a JSON config to output TSX or standalone HTML. ## Quick Start Ask the AI to generate a landing page for your product using the landing-page-generator skill, providing the product name, tagline, target audience, key pain point, pricing tiers, design style, and copy framework.

Frequently Asked Questions about landing-page-generator

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I generate a Next.js landing page with Tailwind CSS?▼

Provide the product name, tagline, target audience, pain point, key benefit, pricing tiers, design style, and copy framework using the trigger format. The skill outputs complete TSX components with Tailwind classes, SEO meta, and structured data, or you can run landing_page_scaffolder.py with a JSON config.

What copywriting frameworks work for SaaS landing pages?▼

PAS (Problem-Agitate-Solution) suits pain-point-driven products, AIDA fits classic direct response pages, BAB works for aspirational products, and 4Ps fits B2B pages with measurable outcomes. The skill includes worked SaaS examples for each framework.

Can the scaffolder output plain HTML instead of React components?▼

Yes, landing_page_scaffolder.py supports three output formats: tsx for Next.js with Tailwind, html for a standalone page with inline CSS, and json for metadata. Select the format with the --format flag when running the script.

Does the landing page output include SEO structured data?▼

Yes, the skill injects FAQPage JSON-LD schema via a script tag and generates Next.js Metadata exports with title, description, and OpenGraph fields. A full SEO checklist covers canonical URLs, OG images, and keyword placement.

What are the limitations of the generated landing page code?▼

Generated components are static presentational sections without backend wiring, analytics, or form submission handlers. You must connect CTAs and forms to your own endpoints and verify Core Web Vitals in your actual deployment environment.

Related Skills

Explore More Marketing & Sales Skills→
gooseworks-aigooseworks-ai
1.1k

brand-voice-extractor

Analyzes published content to extract a Brand Voice Profile with tone, vocabulary, sentence structure, formatting, and audience guidance.

Official
Advanced
YvesdefariaYvesdefaria

ab-testing

Designs and analyzes A/B tests and growth experimentation programs with statistical rigor.

Community
Intermediate
sanky369sanky369
29

positioning-angles

Defines a product's market position using eight positioning frameworks.

Community
Basic
in-parallel-oyin-parallel-oy

website-design

Maintain and extend the In Parallel marketing website with Astro 5, Tailwind CSS 4, and Sanity CMS.

Official
Advanced