skills.rest
Dokkabei97
Dokkabei97COMMUNITY
Explore all skills by this author →
GitHub

landing-page-gen

Generate React or HTML landing pages with Tailwind CSS sections.

2|Updated Feb 28, 2026
Search Tags:#html#marketing#landing page#react#tailwind css#web design#conversion optimization
One-click install
npx skills add https://github.com/Dokkabei97/forged-claude-code --skill landing-page-gen
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: landing-page-gen
Source: https://github.com/Dokkabei97/forged-claude-code/tree/main/skills/cmo/landing-page-gen
Command: npx skills add https://github.com/Dokkabei97/forged-claude-code --skill landing-page-gen

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill automates the creation of high-converting landing pages, streamlining the process of launching new products or features.

Core Features & Use Cases

  • Full Page Generation: Creates complete landing pages with essential sections like Hero, Benefits, Social Proof, and CTA.
  • Code Output: Generates code in React or HTML, styled with Tailwind CSS.
  • Use Case: Launching a new SaaS product? Use this Skill to quickly generate a professional landing page that clearly communicates value and drives sign-ups.

Quick Start

Generate a landing page for a new AI writing assistant tool.

Frequently Asked Questions about landing-page-gen

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

FAQPage Schema
How do I generate a conversion-optimized landing page for a SaaS product launch?▼

To generate a conversion-optimized landing page, this tool outputs complete React or HTML code styled with Tailwind CSS. It automatically builds essential sections including Hero, Problem Statement, Solution, Benefits, Social Proof, Pricing, FAQ, and a final CTA.

Can I create landing pages for waitlist signups and A/B testing variants?▼

Yes, you can create landing pages for waitlist signups and A/B testing variants. The generator supports specific triggers for these use cases, allowing you to quickly produce distinct page versions to test conversion rates.

What is the best way to build a landing page using React and Tailwind CSS?▼

The best way to build a landing page with React and Tailwind CSS is to use this automated generator. It structures your page with high-converting sections like Social Proof and Pricing, outputting ready-to-deploy code without manual design.

Do I need any external dependencies or components to use this landing page generator?▼

No, you do not need any external dependencies or components to use this landing page generator. It operates independently to produce your HTML or React code with Tailwind CSS styling based on your product launch inputs.

Does this tool output raw HTML or React components for web design?▼

This tool outputs both raw HTML and React components for web design. You can choose your preferred format, and the resulting landing page will be fully styled using Tailwind CSS for immediate deployment.

Related Skills

Explore More Marketing & Sales Skills→
mujtaba3Bmujtaba3B
2

copywriting

Write persuasive marketing copy for web pages and product messaging.

Community
Advanced
aaron-he-zhuaaron-he-zhu
2.5k

landing-optimizer

Analyze landing pages for influencer traffic and generate A/B testing plans.

Community
Intermediate
mklozmkloz

frontend-product-ui-engineer

Build React UI components with Tailwind CSS and state management.

Community
Advanced
slamb2kslamb2k
5

pixel-pusher

Convert vague website-design requests into HTML mockups and JSON design systems.

Community
Basic