landing-page

Prototype landing pages with native HTML/CSS/JS and design-system evidence.

Updated Apr 27, 2026
One-click install
npx skills add https://github.com/vTRKA/supervibe --skill landing-page-vtrka
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: landing-page
Source: https://github.com/vTRKA/supervibe/tree/main/skills/landing-page
Command: npx skills add https://github.com/vTRKA/supervibe --skill landing-page-vtrka

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This Skill prevents confusing, ungrounded landing-page iterations by ensuring your prototype follows an approved design system, includes SEO and analytics scaffolding, and follows a review-and-approval lifecycle with evidence before handoff.

Core Features & Use Cases

  • Native HTML/CSS/JS landing prototypes: Generate a production-like page layout using approved design-system tokens and components.
  • Landing-specific SEO + structured data: Add canonical URLs, Open Graph/Twitter metadata, and JSON-LD structured data from the start.
  • Analytics + conversion instrumentation: Attach data-analytics-event hooks to hero/primary/footer CTAs and key milestones.
  • Preview feedback + evidence-gated approval: Require a preview feedback overlay and gate creative claims behind local artifact evidence.
  • Design-system preflight + anti-slop enforcement: Enforce design-intelligence checks and fail closed when required evidence is missing.

Quick Start

Ask your AI tool to generate a landing-page prototype using your approved design system and include SEO and analytics scaffolding for review.

Frequently Asked Questions about landing-page

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

FAQPage Schema
How do I build a landing page prototype with built-in SEO and analytics hooks?

To build a landing page prototype with SEO and analytics hooks, generate native HTML/CSS/JS using approved design-system tokens. Add canonical URLs, Open Graph metadata, JSON-LD structured data, and attach data-analytics-event hooks to hero, primary, and footer CTAs.

What is design-system preflight and anti-slop enforcement for landing pages?

Design-system preflight and anti-slop enforcement for landing pages are validation checks ensuring prototypes follow approved design tokens and fail closed when required local artifact evidence is missing before creative handoff.

Can I generate structured data and Open Graph metadata for a campaign landing page?

Yes, you can generate structured data and Open Graph metadata for a campaign landing page. The prototype scaffolds canonical URLs, Open Graph/Twitter metadata, and JSON-LD structured data from the start alongside conversion-focused section ordering.

How do I add conversion-focused CTA instrumentation to a native HTML landing page?

Add conversion-focused CTA instrumentation to a native HTML landing page by attaching data-analytics-event hooks to hero, primary, and footer CTAs. Configure viewport, structure, and tone inputs in config.json to control the layout.

Does landing page generation require explicit approval before artifact handoff?

Yes, landing page generation requires explicit approval before artifact handoff. A preview feedback overlay is provided, and the prototype must pass Anti-AI-Slop gating backed by local artifact evidence before any files are released.

What are the limitations of using design-system tokens for landing page prototypes?

A limitation of using design-system tokens for landing page prototypes is that ungrounded or confusing iterations fail preflight checks. The system enforces design-intelligence validation and fails closed if required evidence is missing, preventing handoff.