markup-landing-page

What problem does it solve?

This Skill helps you stop guessing at landing-page structure and design decisions by giving production-ready patterns that consistently drive visitors toward purchase.

Core Features & Use Cases

• Conversion-first section anatomy: Prescribes an opinionated order (nav, hero, how-it-works, features, privacy/trust, pricing, FAQ, and CTAs) so every section answers the next objection.
• Single-source design system: Defines a token-driven CSS approach using custom properties for color, typography, spacing, radii, and effects, including strict rules that prevent hardcoded colors.
• Production SEO + theming baseline: Includes dark/light mode implementation with meta tags, plus an OG and JSON-LD structured-data checklist to improve discoverability and sharing.
• Use Case: When drafting a SaaS or indie product landing page for a new release, you can follow this playbook to produce a fast, accessible, and on-brand page layout without overbuilt UI frameworks.

Quick Start

Use the markup-landing-page skill to generate a complete landing-page structure, including the design token plan, section order, SEO/OG/JSON-LD baseline, and CTA hierarchy for your product landing.