New: 98,000+ skills indexed from GitHub repos with 100+ stars · every skill safety-checkedBrowse top skillsTop skills
Esc to closeBrowse all skills
Submit a skillBrowse skills
Submit a skillBrowse skills

Agent skill

Customer Story

by microlinkhq in microlinkhq/www

Scaffold a customer story page under src/pages/use-cases/customers/ from the CustomerStory module.

MITAuto-check passedWriting & Content

Install Customer Story

skills CLI
$ npx skills add microlinkhq/www --skill customer-story -a claude-code

Project install by default; add -g for ~/.claude/skills/.

GitHub CLI
$ gh skill install microlinkhq/www customer-story --agent claude-code

Project scope by default; add --scope user for a personal install. Needs GitHub CLI 2.90.0 or later (public preview).

Manual copy
$ git clone --depth 1 https://github.com/microlinkhq/www.git skills-src && mkdir -p .claude/skills && cp -r skills-src/.cursor/skills/customer-story .claude/skills/customer-story && rm -rf skills-src

Use ~/.claude/skills/ instead of .claude/skills for a personal install. The folder must contain SKILL.md.

Claude Code skills documentation · loads skills from .claude/skills/

Facts

Skill name
customer-story
GitHub stars
142
Token cost
~1.6k tokens
SKILL.md length
582 words
Files
4 (incl. references)
Skills in repo
6
Repo updated
First seen
Licence
MIT

At a glance

Scaffold a customer story page under src/pages/use-cases/customers/ from the CustomerStory module.

  • Works in 4 steps: src/components/patterns/CustomerStory/ind… → src/pages/use-cases/customers/luckynote.j… → .cursor/skills/customer-story/references/… → …
  • Tasks that involve Storytelling
  • SKILL.md covers Read first, Shared module, Typography and Hero structure, plus 6 more sections
  • Calls npx

What it does

Customer Story is an agent skill from microlinkhq/www. Scaffold a customer story page under src/pages/use-cases/customers/ from the CustomerStory module.

Its SKILL.md is about 1.6k tokens, which your agent loads only when the skill is triggered. The skill folder holds 4 other files, including reference files (for example `references/accent-colors.md`, `references/cta-routing.md` and `references/template.md`).

It sits in Writing & Content, covering Storytelling. The repository describes itself as: AI-ready infrastructure for interacting with the web. Built on real browsers. Exposed through a single API. The licence is MIT.

When your agent uses it

  • Tasks that involve Storytelling

Example prompts

  • “/customer-story”

Requirements

  • Node.js

Workflow steps

4 steps, taken from the first numbered list in SKILL.md.

  1. src/components/patterns/CustomerStory/index.js — barrel exports.
  2. src/pages/use-cases/customers/luckynote.js — reference page. Mirror its structure.
  3. .cursor/skills/customer-story/references/template.md — template with {{TOKEN}} placeholders.
  4. .cursor/skills/customer-story/references/cta-routing.md — use-case → CTA href mapping.

What it can do on your machine

Read from SKILL.md and the folder at commit e1a2833. It shows what the files ask for, not the result of running them.

  • Tool permissions

    Pre-approves nothing: there is no allowed-tools line, so your agent's usual permission prompts apply.

    From allowed-tools in the SKILL.md frontmatter.

  • Runs code

    Shell commands in SKILL.md call:

    • npx

    From the folder's file list and the shell code blocks in SKILL.md.

  • Network

    No URLs in SKILL.md. Its commands use npx, which can reach the network depending on how they are called.

    From URLs in SKILL.md, links to its own repository left out.

  • Credentials

    Names no API keys, tokens, secrets or passwords.

    From names ending in _API_KEY, _TOKEN, _SECRET, _KEY or _PASSWORD in SKILL.md.

Context cost

Customer Story loads about 1.6k tokens when it runs, and up to ~4.8k if it reads all its reference files. Until then it costs about 28 tokens; SKILL.md has 582 words of instructions outside code blocks.

Always · name and description, kept in context so the agent knows when to use it
~28
When it runs · the whole SKILL.md, loaded when a task matches
~1.6k
With references · SKILL.md plus every file in references/, read only if the agent opens them
~4.8k

Estimates: characters ÷ 4, the usual rule of thumb; real counts depend on the model's tokenizer. Scripts and assets cost tokens only if the agent reads them.

Safety

Auto-check passed

The automated check found no risky patterns in SKILL.md.

Automated static check — not a guarantee. Review scripts before installing. It scans the text of SKILL.md for risky patterns (piping downloads into a shell, reading credential files, hidden Unicode, destructive commands); files beside SKILL.md are not scanned.

SKILL.md

The full file from microlinkhq/www at commit e1a2833, republished under its MIT licence (© microlinkhq). 582 words, ~1,581 tokens.

Download SKILL.mdSave it as .claude/skills/customer-story/SKILL.md (or your agent's skills folder). This skill also uses 3 other files; get the full folder from GitHub.
name
customer-story
description
Scaffold a customer story page under src/pages/use-cases/customers/ from the CustomerStory module.

Customer Story

Build a customer page at src/pages/use-cases/customers/<slug>.js (route /use-cases/customers/<slug>).

Unified route. Customer stories live under src/pages/use-cases/customers/, next to the use-case recipes in src/pages/use-cases/. Customer pages still use the CustomerStory module (testimonial, flow diagram, thanks section) — this skill — while use-case recipes use the UseCaseStory module (see the use-case-landing skill). On the shared /use-cases listing, "Customer stories" is the first (default) tab, followed by one tab per product. The full list lives on the /use-cases/customers hub. The old /customers, /customers/<slug> and /use-cases/<slug> URLs redirect to the new ones via vercel.json; build links with customerPath(slug) from customers.js, never by hand.

Read first

  1. src/components/patterns/CustomerStory/index.js — barrel exports.
  2. src/pages/use-cases/customers/luckynote.js — reference page. Mirror its structure.
  3. .cursor/skills/customer-story/references/template.md — template with {{TOKEN}} placeholders.
  4. .cursor/skills/customer-story/references/cta-routing.md — use-case → CTA href mapping.

Shared module

All primitives live in src/components/patterns/CustomerStory/. Import by name. Never re-declare locally.

ExportNotes
ACCENTShared accent object (text: 'link'). Imported, never defined locally.
CUSTOMERSRegistry of all customer metadata (slug, name, blurb, icon, quote, author, role, avatar, initials).
Section, SectionInner, Caption, Figure, FigureImageLayout primitives.
DashedGridOverlayDecorative background.
EyebrowAccent-aware label. Pass accent={ACCENT}.
TestimonialProps: accent, quote, author, role, company, initials, optional avatar, maxWidth.
MoreCustomersFilters out currentSlug. Self-omits when < 2 siblings.
CtaSectionCTA panel. Uses colors.link for background tint internally. Props: accent, headlinePrefix, headlineAccent, body, href, label, optional mt.
WhyCardProps: accent, number, kicker, title, body.
FlowDiagramProps: accent, nodes array ({ label, sub, active? }).

Typography

  • Paragraphs: <Text as='p'> — uses Text defaults (fontSize: [1,1,2,2], lineHeight: 3).
  • Section headings: <Text as='h2'> — same base component.
  • No BodyText, no SubheadBase. Just Text with the appropriate as prop.

Hero structure

The hero shows logo + company name (not a "Customer story" tag):

jsx
<Flex css={theme({ alignItems: 'center', gap: 2, pb: [3, 3, 4, 4] })}>
  <img src='/images/clients/{{ICON}}' alt='' width='40' height='40'
    css={theme({ display: 'block', borderRadius: 2, width: '40px', height: '40px' })}
    style={{ objectFit: 'cover' }} decoding='async' />
  <Text css={theme({ color: 'black', fontSize: 2, fontWeight: 'bold', lineHeight: 1 })}>
    {{CUSTOMER_NAME}}
  </Text>
</Flex>

Section order

Hero (logo + name, h1, intro paragraph, ArrowLink CTA)
AboutCustomer (Eyebrow, h2, paragraphs, external link, Testimonial)
HowTheyUseIt (Eyebrow, h2, paragraphs, FlowDiagram or image)
WhyMicrolink (Eyebrow, h2, lead paragraph, 3× WhyCard)
CtaSection (shared)
MoreCustomers (shared)
ThanksSection (logo + acknowledgement)

CUSTOMERS registry

When adding a customer, append to src/components/patterns/CustomerStory/customers.js:

js
{
  slug: '<slug>',
  name: '<name>',
  blurb: '<~10 words, period>',
  icon: '/images/clients/<icon>',
  category: '<product> API',
  quote: '<short quote for index page>',
  author: '<name>',
  role: '<role>',
  avatar: '/images/clients/<avatar>.jpeg',
  initials: '<XX>'
}

The unified /use-cases listing (src/pages/use-cases/index.js) is data-driven over CUSTOMERS — the rotating hero, the "Trusted by innovative companies" logo bar, the "Customer stories" tab and the /use-cases/customers hub all map over it. Appending here is enough; you do not edit index.js per customer. The cards link to /use-cases/customers/<slug> through customerPath(slug).

Show full SKILL.md (250 more words)Show less

Hard rules

  • Never invent customer claims, metrics, or features. If the website doesn't say it, ask.
  • Never use pink/secondary/pinky/pinkest accent — reserved for feature pages.
  • External links to customer sites: use <Text as='a' target='_blank' rel='noopener'>, NOT the repo Link component (which adds noreferrer, killing SEO backlink value).
  • Hero CTA label format: See how to integrate <product>. Must differ from bottom CTA label.
  • <h1> must include scrollMarginTop: 4.
  • Head title format: <name>: <use case> (no brand suffix — Meta appends — Microlink).
  • Head image must be absolute URL: cdnUrl('banner/screenshot.jpeg').
  • Never run prettier. Lint with npx standard src/pages/use-cases/customers/<slug>.js.

Workflow

Ask one question at a time:

  1. Customer name — compute slug, verify no collision in src/pages/use-cases/customers/ or with a use-case route (test/integration/use-cases/registry.js enforces it).
  2. Website URL — WebFetch homepage + key pages. Build factual notes.
  3. How they use Microlink — which products, where in stack. Feeds How/Why sections + CTA routing.
  4. Testimonial — real quote (author + role + avatar), placeholder, or none.
  5. Screenshots — primary screenshot, diagram style (flow/image/placeholder), optional hero image.
  6. Customer logo — SVG for ThanksSection, or text-only fallback.
  7. CTA routing — infer from use case per references/cta-routing.md. Propose and confirm.
  8. Registry — append entry to customers.js.
  9. Summary — show all values, wait for explicit confirmation before writing.

Verification

  1. npx standard src/pages/use-cases/customers/<slug>.js — fix until clean.
  2. Grep for {{ — no placeholders remaining.
  3. Verify section order matches canonical list.
  4. Verify Hero CTA ≠ Bottom CTA label.
  5. Verify entry added to customers.js.

Updating existing pages

Read the file, identify what needs changing, run only relevant steps, re-lint.

© microlinkhq, MIT. Rendered from Markdown: HTML in the file is shown as text, images as links, and headings moved down two levels. Raw file

Files

SKILL.md and 3 other files (references) in .cursor/skills/customer-story of microlinkhq/www.

  • SKILL.md
  • references/accent-colors.md
  • references/cta-routing.md
  • references/template.md

Open the folder on GitHubat commit e1a2833

Compare with similar skills

Customer Story next to the 5 skills that share the most tags, products or categories with it. Stars are the repository's; “used in” counts other GitHub owners with a copy.

Customer Story compared with similar skills
SkillStarsUsed inTokensAuto-checkLicenceRepo updated
Customer Story this skillmicrolinkhq/www142—~1.6kAutomated safety check: PassMIT
Data Storytellingynulihao/AgentSkillOS61815 repos~2.8kAutomated safety check: PassNone
Chinese Novel Writing Systemleenbj/novel-creator-skill671—~3.9kAutomated safety check: PassNone
Chinese Novelist Chapter WriterPenglongHuang/chinese-novelist-skill3.3k—~491Automated safety check: WarnMIT
Liu Run Style Business Column Writerliangdabiao/liurun-bookwriter-skills277—~1.8kAutomated safety check: PassMIT
Business Insight Essay Writerliangdabiao/liurun-bookwriter-skills277—~2.5kAutomated safety check: PassMIT

Similar skills

  • Data Storytelling

    ynulihao/AgentSkillOS

    Transform data into compelling narratives using visualization, context, and persuasive structure.

    618 GitHub starsUsed in 15 repos~2.8k tokens
    Writing & ContentAuto-check passed

  • Chinese Novel Writing System

    leenbj/novel-creator-skill

    Guides long-form Chinese novel writing from a rough idea through outlines, chapter drafts and quality gates, with file-based memory for a story meant to reach 300万字.

    671 GitHub stars~3.9k tokensUpdated 7 mo ago
    Writing & ContentAuto-check passed

  • Chinese Novelist Chapter Writer

    PenglongHuang/chinese-novelist-skill

    Writes long Chinese novels chapter by chapter through guided questions, outlining, drafting with cliffhangers and automatic validation, with resumable projects.

    3.3k GitHub stars~491 tokensUpdated 4 days ago
    Writing & ContentAuto-check: warnings

  • Liu Run Style Business Column Writer

    liangdabiao/liurun-bookwriter-skills

    Writes long-form Chinese business commentary in Liu Run's voice, using his eight writing principles, three structures, and SCQA logic patterns.

    277 GitHub stars~1.8k tokensUpdated 3 mo ago
    Writing & ContentAuto-check passed

  • Business Insight Essay Writer

    liangdabiao/liurun-bookwriter-skills

    Drafts Chinese business-insight essays, short audio scripts and year-end speeches in a specific public commentator's rhythm, built from his books, talks and broadcasts.

    277 GitHub stars~2.5k tokensUpdated 3 mo ago
    Writing & ContentAuto-check passed

  • Shakespeare Writing Studio

    ZCZHAO-1999/shakespeare-writing-studio

    Produce publish-ready Chinese and English writing packages across WeChat articles, Medium/Substack essays, research notes, founder memos, op-eds, speeches, data storytelling, statistical graphics…

    178 GitHub stars~1.5k tokensUpdated 3 mo ago
    Writing & ContentAuto-check passed

More from microlinkhq/www

  • Guide Authoring

    microlinkhq/www

    Create or revise docs guides under src/content/docs/guides with runnable MDX examples.

    142 GitHub stars~2.5k tokensUpdated yesterday
    Auto-check passed

  • Use Case Landing

    microlinkhq/www

    Create or improve use-case landing pages under src/pages/use-cases/ from the UseCaseStory module.

    142 GitHub stars~3.1k tokensUpdated yesterday
    Auto-check passed

  • Generate Changelog

    microlinkhq/www

    Generate concise, user-facing changelog entries for Microlink by inspecting git commits across relevant repositories.

    142 GitHub stars~1.9k tokensUpdated yesterday
    Auto-check passed

  • Verify

    microlinkhq/www

    Verify UI changes in microlink/www by driving the Gatsby dev server with agent-browser.

    142 GitHub stars~311 tokensUpdated yesterday
    Auto-check passed

  • Alternative Landing

    microlinkhq/www

    Create or improve competitor alternative pages under src/pages/alternative/.

    142 GitHub stars~5.2k tokensUpdated yesterday
    Auto-check passed

Categories

Questions about Customer Story

What does Customer Story do?

Scaffold a customer story page under src/pages/use-cases/customers/ from the CustomerStory module. Customer Story is an agent skill from microlinkhq/www. Scaffold a customer story page under src/pages/use-cases/customers/ from the CustomerStory module.

When should I use Customer Story?

Customer Story fits situations like: tasks that involve Storytelling.

How do I install Customer Story in Claude Code?

Run `npx skills add microlinkhq/www --skill customer-story -a claude-code`. Or copy the skill folder (.cursor/skills/customer-story in microlinkhq/www) into .claude/skills/customer-story in your project. Claude Code loads it when a task matches its description.

How do I install Customer Story in Codex?

Run `npx skills add microlinkhq/www --skill customer-story -a codex`. Or copy the skill folder (.cursor/skills/customer-story in microlinkhq/www) into .agents/skills/customer-story in your project. Codex loads it when a task matches its description.

Can I use Customer Story in Cursor, Gemini CLI or GitHub Copilot?

Cursor, Gemini CLI, GitHub Copilot and OpenCode also load SKILL.md folders. With the skills CLI, run `npx skills add microlinkhq/www --skill customer-story -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/customer-story, .gemini/skills/customer-story, .github/skills/customer-story and .opencode/skills/customer-story in your project.

What does Customer Story need to run?

Going by SKILL.md and its folder, Customer Story needs the command-line tools its instructions call (npx). Our summary lists: Node.js.

Does Customer Story access the network?

SKILL.md contains no URLs. Its commands use npx, which can reach the network depending on how they are called. This is read from the text; nothing was executed.

Is Customer Story safe to install?

Our automated static check of SKILL.md found no risky patterns, such as piping downloads into a shell, reading credential files or hidden Unicode. It is not a guarantee. Review the folder before installing.

What licence does Customer Story use?

Customer Story is published under the MIT licence (the repository's licence). It allows redistribution, so the full SKILL.md is shown on this page.

How many tokens does Customer Story use?

About 1.6k tokens (SKILL.md is roughly 6.3k characters). Agents keep only the skill's name and description in context until a task matches; then they load SKILL.md in full. Its references folder adds about 3.3k tokens, read only when the agent opens those files.

What are the alternatives to Customer Story?

Skills that share tags, products or a category with Customer Story: Data Storytelling (ynulihao/AgentSkillOS, 618 stars), Chinese Novel Writing System (leenbj/novel-creator-skill, 671 stars), Chinese Novelist Chapter Writer (PenglongHuang/chinese-novelist-skill, 3.3k stars) and Liu Run Style Business Column Writer (liangdabiao/liurun-bookwriter-skills, 277 stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.

Who maintains Customer Story?

microlinkhq (a GitHub organization) maintains it in microlinkhq/www, which has 142 GitHub stars. The repository holds 6 skills in this directory. The repository was last updated on October 9, 2026.

Source: microlinkhq/www on GitHub. Facts on this page come from the repository at the commit we read; the author's words are quoted as theirs.