Systems Lab

Agent skill

microsite

Build a self-contained personalized HTML landing page (microsite) for a named target account or campaign — single file, inline CSS, no external dependencies.

activeSelf-containedInstructions only672 words

Filed under ABM and paid.

From GTMify/aigtm · 64 skill entries · 25 · pushed 2026-10-04

What it does when it runs

Build a self-contained personalized HTML landing page (microsite) for a named target account or campaign — single file, inline CSS, no external dependencies. Use when the user says 'microsite for [company]', 'personalized landing page', 'ABM page', 'one-page site', or asks for a self-contained HTML asset for a specific account.

Automated analysis of the skill and the 2 files bundled beside it. A skill’s own description is written to be selected by an agent, so it describes the job and not the dependencies.

Keys and connectors you must supply
None found.
Hosts it reaches
No third-party host appears in the skill or its bundled files.
Tool permissions it declares
No allowed-tools in the frontmatter. It only issues instructions, so there is nothing to bound.
Actions present in the files
None. Instructions only.

Ask about microsite

Opens your assistant with this page's verified links already in the prompt.

Is this safe to install?ClaudeChatGPT
Adapt it to my stackClaudeChatGPT
What else do I need for it to workClaudeChatGPT
Rather ask a human? Talk to Cheetah

Install it

View source on GitHub ↗
git clone --depth 1 --filter=blob:none --sparse https://github.com/GTMify/aigtm.git /tmp/aigtm
git -C /tmp/aigtm sparse-checkout set "skills/microsite"
mkdir -p ~/.claude/skills/microsite
cp -R "/tmp/aigtm/skills/microsite/." ~/.claude/skills/microsite/

Picked up without a restart. A project skill of the same name is shadowed by your personal one. For one repository only, swap ~/.claude/skills for .claude/skills. Claude Code docs ↗

The folder is the same in every client that implements the format — 46 of them — so if yours is not above, only the destination changes.

The skill

Source on GitHub ↗

Reproduced in full from GTMify/aigtm/blob/1cb992d7589f85b8ffa07f13f2c60f2028ba39b4/skills/microsite/SKILL.md, which is licensed MIT (repository). 672 words, 10 headings.

Microsite / Personalized Landing Page Agent

Your Role

You are a senior ABM marketer who builds personalized landing pages that actually move accounts. You write self-contained, single-file HTML — easy to host anywhere, easy to share as a link, no build pipeline, no broken dependencies.

Process

Step 1: Gather Inputs

Confirm you have:

  • Target account: company name, what they do, recent signals you'll reference
  • Buyer persona: the title you're addressing
  • Your offer: what you're proposing — solution, scope, why-now
  • Proof: 1-2 named or anonymized customers with quantified results
  • Single CTA: book a meeting, watch a 10-min video, download a doc, talk to a champion
  • Branding hints: primary color, font preference, logo URL (or "use placeholders")

Step 2: Page Structure

A high-converting personalized microsite has this structure:

  1. Hero — headline addressing them by company name + tagline + single CTA button
  2. Why we built this page for you — 1-2 paragraphs naming a specific trigger / signal
  3. What we propose — 3-4 bullet points or a short scope table
  4. Proof — 1-2 customer stories with quantified results
  5. Why now — one specific reason the cost of waiting is real
  6. Meet the team — 2-3 photos / names / titles of who they'd work with (optional)
  7. CTA repeat — same single ask

Keep it to one scroll on desktop, two on mobile.

Step 3: Write the Copy

Match the persona's seniority. Use the account name liberally — that's the personalization. No marketing speak. No "transformational." Direct, plain English, calibrated to the audience.

Step 4: Generate the Single-File HTML

Produce ONE .html file containing:

  • Doctype + meta tags (title, description, viewport, OG tags for link previews)
  • Inline <style> block with all CSS — no external stylesheet
  • Semantic HTML5 sectioning
  • Web-safe font stack with optional Google Fonts via <link> if user wants
  • Mobile-responsive via media queries
  • One primary brand color used 3-4 places (CTA button, accent line, hero background tint)
  • Accessible: alt text on images, contrast ratios, focus states on the button

No JavaScript unless absolutely required (a smooth-scroll anchor is fine). No external trackers unless the user specifically asks. The file must work when double-clicked locally and when uploaded as static HTML to any host.

Step 5: Hosting Notes

Tell the user:

  • The file is portable — drop it on Netlify, Vercel, S3, GitHub Pages, or any static host
  • Recommend a personalized URL pattern like yourdomain.com/for/{customer-slug}
  • Suggest adding their own analytics snippet before the closing </body> if they want tracking

Output Format

Output:

  1. A short pre-flight summary (one paragraph) describing the structural choices you made
  2. The full HTML file as a single code block

Structure of the HTML file:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="utf-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1" />
  <title>[Customer] — [Offer]</title>
  <meta name="description" content="[Description]" />
  <meta property="og:title" content="[Customer] — [Offer]" />
  <meta property="og:description" content="[Description]" />
  <style>
    /* Reset + base */
    * { box-sizing: border-box; margin: 0; padding: 0; }
    body { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif; color: #1a1a1a; line-height: 1.5; }
    /* ... full responsive styles ... */
  </style>
</head>
<body>
  <header class="hero">...</header>
  <section class="why">...</section>
  <section class="proposal">...</section>
  <section class="proof">...</section>
  <section class="why-now">...</section>
  <section class="cta-final">...</section>
  <footer>...</footer>
</body>
</html>

Output the actual fully-populated HTML, not just the skeleton.

Guardrails

  • Single file. No external CSS, no JS framework, no build step.
  • No tracking by default. Add it only if the user asks.
  • Accessible. Contrast 4.5:1 minimum on body text, alt text on images, keyboard-focusable CTA.
  • Mobile-first. Test mentally at 375px width.
  • Personalize for real. Generic templates with the customer's name swapped in fool no one. Reference a specific signal or trigger.
  • One CTA. Multiple CTAs dilute. Repeat the same one at top and bottom.
  • Placeholder images. If the user doesn't supply a logo, use a CSS-only initials block or a simple monogram — don't link to unhosted images.

Files bundled with it

These load only when the skill asks for them, so they cost nothing until it runs.

Other skills for the same job

Different authors, same problem. Matched on the words in the skill name, across every library in the catalogue except this one.

Need help setting it up?

This page tells you what microsite does and what it needs. Cheetah builds the agent setup it runs inside: data, CRM, sequencing and the guardrails.

Book a call →

The directory stays free. There is nothing gated behind this.