Guide · Agent skill
How to use the Funnel Infographic agent skill (info-funnel)
Updated · written with AI from the project's own documentation and checked against our catalogue data
The Funnel Infographic skill (info-funnel) lets an AI agent turn an ordered list of 3 to 6 stages with counts into a single vertical HTML funnel image. It is for marketers, founders, analysts, recruiters and educators who already have conversion numbers and want a shareable graphic. After this guide you will know what the skill does, how to install it, how to ask for a funnel, and what to check in your numbers before you publish.
Funnel Infographicnexu-io/html-anything · Apache-2.0 Download the skill Quick start
- 1Download the ZIP. Get the info-funnel skill ZIP from the page where you found this guide.
- 2Unzip into a skills folder. Unzip it into ~/.claude/skills/ for personal use, or into a project's .claude/skills/ folder.
- 3Or upload it in the Claude apps. In the Claude apps, go to Settings → Capabilities → Skills and upload the ZIP.
- 4Prepare ordered stages. List 3 to 6 stages from widest to narrowest, with an absolute count for each.
- 5Ask for the funnel. Describe the funnel in plain language, name the stages and counts, and say it is for a vertical social post.
- 6Check the output. Recompute a stage rate and the overall rate to confirm the numbers are right before sharing.
What the skill makes the agent do
When the skill is installed, the agent takes a list of ordered stages with absolute numbers, such as visitors, sign-ups, trials and paying customers, and produces one HTML file shaped like a funnel. Each stage shows its absolute number, its conversion rate from the previous stage, and a short insight at the bottom about where the biggest drop-off happens.
The layout is fixed by the skill: a vertical 9:16 canvas suited to Instagram Stories or Xiaohongshu, with set colour themes, fonts and sizes. The skill only formats the numbers you give it. It does not pull data from analytics tools.
- Input: 3 to 6 ordered stages with counts (people, pieces or amounts)
- Output: one single-file HTML image, inline CSS, no JavaScript
- Each stage: large absolute number, stage name, short note, conversion rate badge
- Bottom strip: cumulative conversion rate and 1-2 sentences of insight
Install the info-funnel skill
Download the skill ZIP from the page where you found this guide. Then choose one of the install routes below. Unzip the archive into your personal skills folder, ~/.claude/skills/, so the skill is available in all your projects. Or unzip it into a project's .claude/skills/ folder so it applies only to that project.
If you use the Claude apps instead of the file system, upload the ZIP under Settings → Capabilities → Skills.
- Personal install: unzip into ~/.claude/skills/
- Project install: unzip into the project's .claude/skills/ folder
- Claude apps: Settings → Capabilities → Skills, then upload the ZIP
Ask for a funnel in plain language
The skill is driven by your request. Describe the process as an ordered set of stages and give a count for each one. If you only have percentages, the skill's default is to treat the top stage as 100% or 10,000 people, so say so if that is not what you mean.
The source does not list exact trigger phrases, so describe the funnel naturally: name the stages in order, give the numbers, and say where it will be shared, such as an Instagram Story. Keep it to 3 to 6 stages, because the skill refuses to go beyond 6.
- Give stages in order, from widest (top) to narrowest (bottom)
- Give an absolute count for each stage, not just percentages
- Optionally add a name, a short note and a unit for each stage
- Mention the time window if it matters, for example the last 90 days
阶段 1: 100,000 名访客
阶段 2: 18,500 名注册（18.5%）
阶段 3: 6,200 名启动试用（33.5%）
阶段 4: 1,450 名转付费（23.4%）
阶段 5: 920 名 30 天留存（63.4%）Check the numbers the agent uses
The skill uses fixed formulas. Each stage's conversion rate is the current stage divided by the previous stage. The cumulative conversion rate is the last stage divided by the first. Percentages keep one decimal place and thousands use commas. Because the skill only formats what you supply, wrong inputs produce a funnel that looks wrong.
Before you publish, recompute a few rates yourself. The bundled example file shows the expected result: 920 divided by 100,000 is 0.92% overall, and the largest drop is from visitors to sign-ups.
- Stage conversion = current stage ÷ previous stage
- Cumulative conversion = last stage ÷ first stage
- Keep the stages in strict decreasing order
- Verify the top-stage baseline and time window before sharing
Look at the bundled examples
The skill ships with example.html, example.md and SKILL.md. The example is a five-stage SaaS sign-up funnel: visitors, sign-ups, trials, paid customers and 30-day retention, with a klein-blue colour theme. The example.md file lists the absolute counts, stage conversion rates and an insight line, which is a useful template for your own data.
Open example.html in a browser to see the finished 9:16 layout. Read SKILL.md to see the exact rules the agent follows, including the theme colours, font stack and layout proportions.
- example.html: the rendered sample graphic
- example.md: the sample data table and insight text
- SKILL.md: the full rules the agent follows
Safety notes: scripts and network
According to the skill's listing, it runs no scripts and uses no network access, and it requires nothing else to be installed. The output is a static HTML file with inline CSS and no JavaScript. The skill forbids external CDN links, icon libraries and font files, so the graphic does not load anything from the web.
Because the skill has no scripts and no network use, the main risk is data accuracy, not code execution. Check the numbers and remove anything confidential, such as internal figures you do not want public, before you post the image.
- Runs scripts: no
- Uses network: no
- Requires: nothing listed
- Output: a single HTML file with no external assets
What people use it for
- Turning a sign-up-to-paid funnel from a SaaS product into a vertical Instagram Story graphic
- Showing a hiring funnel from applications to offers to hires for a recruiting post
- Presenting an enrolment funnel from enquiries to enrolled students for an education audience
- Visualising a retail or consumer conversion path with the sunset-amber theme
- Creating a shareable Xiaohongshu funnel graphic from existing marketing numbers
Frequently asked questions
Is the info-funnel skill free?
The skill is published under the Apache-2.0 licence, as listed on its source page. The page does not list a price, so check the licence text for the terms that apply to your use.
What do I need to use the info-funnel skill?
The listing says it requires nothing else to be installed, runs no scripts and uses no network. You need an agent environment that supports skills, such as Claude with the skill folder or the Claude apps upload option, and your own conversion numbers.
Where do I install the info-funnel skill?
Unzip the downloaded ZIP into ~/.claude/skills/ for all projects, or into a project's .claude/skills/ folder. In the Claude apps, upload the ZIP under Settings → Capabilities → Skills.
Can the skill pull data from Google Analytics or other tools?
No. The skill only formats numbers you provide. If you need real data pulled from analytics tools, you must export or copy those figures yourself first.
Can info-funnel make pie charts or bar charts?
No. The skill explicitly forbids other chart types and is built only for funnels. Each graphic is one funnel with 3 to 6 stages.
Why does the output look wrong?
The skill only formats what you provide, so wrong or out-of-order inputs produce a wrong-looking funnel. Check that the stages decrease in order and that the counts match your source data.
New agent skills, repos and AI tools — every week
The best new skills and open-source projects, the fastest-growing repos, and one free prompt. Five minutes to read. Unsubscribe anytime.
Our verdict
Use info-funnel if you already have ordered conversion numbers and want a clean, shareable 9:16 funnel graphic without design work. Pick another tool if you need live data from analytics, non-funnel charts, or layouts other than a single vertical HTML file.
Download the skill