Getting it into your agent
One page per mod, every tool's command on it. A separate URL per tool would split the same page into five that compete with each other.
npx agentmods add skills/just-agent/just-progress-bar-skill/skillnpx skills add Just-Agent/just-progress-bar-skill --skill skillgit clone --depth 1 https://github.com/Just-Agent/just-progress-bar-skillWrote this? Show the measurements
A badge with what this costs and how it scanned, read live from this page, so it follows the numbers instead of freezing them. Markdown for a README, HTML for a documentation site or a project page.
[](https://agentmods.dev/skills/just-agent/just-progress-bar-skill/skill)<a href="https://agentmods.dev/skills/just-agent/just-progress-bar-skill/skill"><img src="https://agentmods.dev/badge/skills/just-agent/just-progress-bar-skill/skill.svg" alt="Measured on agentmods" height="20"></a>What it costs to keep this loaded
Counted locally with the o200k_base tokenizer, which is exact for GPT models; Claude uses its own tokenizer and its counts differ. Treat this as one consistent yardstick across the catalogue rather than a bill. Prices are per million input tokens.
| Model | Per session | Once invoked |
|---|---|---|
| Fable 5 | $0.00039 | $0.01491 |
| Opus 5 | $0.00019 | $0.00745 |
| Sonnet 5 | $0.00008 | $0.00298 |
| Haiku 4.5 | $0.00004 | $0.00149 |
Grade A, and why
just-progress-bar-skill scanned grade A with 0 findings against 26 rules in 11 categories — prompt injection, anti-refusal, data exfiltration, privilege escalation, supply chain, agent snooping, system-prompt leakage, SSRF and excessive agency — measured 4d ago.
A static scan of the body, not an audit. Every finding is printed with the line that produced it so you can judge whether it matters here. A mod is markdown that instructs an agent; that is exactly why what it instructs is worth reading.
Nothing flagged
None of the 26 patterns this scan looks for appear in this file: no shell pipes, no recursive deletes, no credential paths, no hidden text, no instruction-override or anti-refusal phrasing, no agent-config snooping. That is not a guarantee, it is the absence of the things that are checkable.
How it starts
The opening of the file, as written. The whole thing — 157 lines — stays where its author put it; the contents beside it link to each section on GitHub.
just-progress-bar-skill
Use this Skill when a user asks for a progress bar, loader, upload state, download button, checkout flow, media scrubber, circular metric, game loading UI, dashboard progress, or an accessibility audit for progressbar markup.
What this Skill does
- Selects a suitable progress bar pattern from the 24-item catalog.
- Generates React or HTML/CSS source from catalog IDs, prompts, or recipe JSON files.
- Explains design tokens and props.
- Audits accessibility: label, semantics, determinate values, indeterminate behavior, status text, and reduced motion.
- Helps other Agents integrate the catalog through MCP-style tools and resources.
- Uses Roadmap-driven iteration when modifying this repository: completed work must be checked in
ROADMAP.mdand recorded in logs.
When to use
Use this Skill for:
- loading, uploading, downloading, installing, processing, generating, checking out, onboarding, media playback, game loading, dashboard metrics, or status feedback;
- requests that mention creative progress bars,
progressbar,aria-valuenow,prefers-reduced-motion, React progress components, HTML/CSS snippets, recipes, CLI generation, or MCP tools; - repository iteration work for
Just-Agent/just-progress-bar-skill.
Do not use it for unrelated charts, full data dashboards, third-party visual asset copying, or copyrighted Dribbble/PSD replication.
Pattern selection
Use these defaults:
| User request | Preferred catalog ID | Reason |
|---|---|---|
| Upload/build progress | gradient-loading |
Clear determinate status with easy value display. |
| Download CTA | download-button |
Combines action and progress feedback. |
| Checkout/order flow | order-steps |
Step semantics are easier to understand than a raw bar. |
| Unknown wait time | gradient-loading with indeterminate: true |
Indeterminate progress should omit aria-valuenow. |
| Neon / sci-fi | neon-ring or lightsaber |
Strong visual identity for AI/generation flows. |
| Game loading | cute-game-loading |
Playful loading pattern. |
| Media playback | music-player or player-progress |
Timeline/scrubber model. |
| Dashboard metric | circular-dashboard |
Compact KPI ring. |
| Emotional waiting state | happy-heart |
Soft waiting state. |
| Vertical dashboard rail | vertical-progress |
Fits side panels and cards. |
What ships with it
10 files beside SKILL.md in the same directory: the scripts, references and assets a skill reads on demand. Not counted in the per-session cost; read them before you install if any of them is executable.
- package.json 949 B
- resources/accessibility-checklist.md 510 B
- resources/catalog.json 72 KB
- resources/catalog.md 1.4 KB
- resources/component-selection-guide.md 799 B
- resources/mcp-tooling.md 1.6 KB
- resources/prompt-recipes.md 1.3 KB
- scripts/audit-progressbar.mjs 1.6 KB runs code
- scripts/generate-progressbar.mjs 2.1 KB runs code
- scripts/smoke-package.mjs 610 B runs code
What this file has done since we first saw it
Hashed on every crawl. A supply-chain change to an agent config is a question of when, not whether, so the history is kept rather than the latest state alone.
- 4d ago First seen · 157 lines · 39 tokens per session scan A 954b88aafb85
just-progress-bar-skill is a skill published in the GitHub repository Just-Agent/just-progress-bar-skill (17 stars, last pushed 3mo ago), licensed MIT. It adds 39 tokens to every session and 1,491 once invoked, about $0.0002 per session on Opus 5. A static security scan graded it A with 0 findings. No closer match exists in the catalogue, so it is treated as the original; first seen 2026-08-30.
Other skills, from other repositories
cinematic-scroll
Build cinematic scroll-driven, 3D-tilt, parallax, and environment-morphing websites — pinned chapter reveals, hero parallax, depth-image figures, hover-tilt cards, background-morphing layouts, release/launch pages, product story pages, or editorial commerce microsites. From a single self-contained scroll section (Mode…
ui-forge
Generate, implement, or redesign distinctive, premium web and app interfaces through product-derived art direction, visual assets, composition, typography, motion, responsive behavior, and anti-slop generation decisions. Use for frontend pages, product screens, dashboards, landing pages, design systems, UI components…
product-motion-design
Design, implement, audit, or repair purposeful motion for React and web interfaces, including GSAP timelines, scroll choreography, micro-interactions, and optional Three.js scenes, with cleanup, responsive behavior, reduced-motion support, and browser verification.
frontend-code-review
Review React, Next.js App Router, TypeScript, Tailwind CSS, shadcn/ui, TanStack Query, and frontend UI code. Use when reviewing a PR, branch, diff, page, component, hook, Server Action, route handler, or API client; debugging frontend behavior; assessing production readiness; or checking runtime bugs, client/server…
micro-interactions
Expert micro-interaction architect for mobile apps, web applications, and responsive websites. Use this skill when the user asks to add, build, fix, audit, or consult on micro-interactions, animations, transitions, motion design, gesture feedback, haptics, loading states, skeleton screens, pull-to-refresh, swipe…
framework-shadcn-tailwind-ui
Use with beautiful-ui and platform-web-ui when the target web app uses shadcn/ui components, Tailwind CSS utilities, or a React component system built from copied component source.