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 skills add jubscodes/get-shit-pretty --skill gsp-design-systemgit clone --depth 1 https://github.com/jubscodes/get-shit-prettyWrote 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/jubscodes/get-shit-pretty/gsp-design-system)<a href="https://agentmods.dev/skills/jubscodes/get-shit-pretty/gsp-design-system"><img src="https://agentmods.dev/badge/skills/jubscodes/get-shit-pretty/gsp-design-system/github.svg" alt="Measured on agentmods" height="20"></a>Or the 80×15 button, for a site that already has a row of RSS and ATOM ones. Only the verdict fits; the numbers stay here.
<a href="https://agentmods.dev/skills/jubscodes/get-shit-pretty/gsp-design-system"><img src="https://agentmods.dev/badge/skills/jubscodes/get-shit-pretty/gsp-design-system.svg" alt="Reviewed on agentmods" width="80" 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.1 | $0.00000 | $0.01616 |
| Opus 5 | $0.00000 | $0.00808 |
| Sonnet 5 | $0.00000 | $0.00323 |
| Haiku 4.5 | $0.00000 | $0.00162 |
Grade A, and why
gsp-design-system 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 9d 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 — 159 lines — stays where its author put it; the contents beside it link to each section on GitHub.
Works two ways:
- Standalone — user runs
/gsp-design-systemfor a quick workspace audit - Building block —
/gsp-startinvokes this in the background during project setup
Output is workspace-level (not project-scoped), so it's shared across all projects and only needs to run once per codebase state change. Re-runnable — overwrites previous output.
Output: .design/system/{STACK,COMPONENTS,TOKENS,CONVENTIONS,CONCERNS}.md
<execution_context> @${CLAUDE_SKILL_DIR}/../../templates/system/STACK.md @${CLAUDE_SKILL_DIR}/../../templates/system/COMPONENTS.md @${CLAUDE_SKILL_DIR}/../../templates/system/TOKENS.md @${CLAUDE_SKILL_DIR}/../../templates/system/CONVENTIONS.md @${CLAUDE_SKILL_DIR}/../../templates/system/CONCERNS.md </execution_context>
mkdir -p .design/system
Step 1: Detect tech stack (→ STACK.md)
-
Detect package manager & lockfile
- Look for
package.json,bun.lockb,pnpm-lock.yaml,yarn.lock,package-lock.json
- Look for
-
Read
package.json- Framework, dependencies, devDependencies, scripts
-
Detect config files
tsconfig.json/jsconfig.json— language, aliasestailwind.config.*— styling, custom themenext.config.*— Next.jsvite.config.*— Viteapp.json/expo.json— React Native / Expopostcss.config.*,.eslintrc.*,.prettierrc.*
-
Identify styling approach
- Tailwind, CSS Modules, styled-components, StyleSheet, vanilla CSS
-
Identify architecture patterns
- Component style (functional, forwardRef, compound)
- State management (Context, Zustand, Redux, Jotai)
- Data fetching (Server Components, React Query, SWR)
- Routing (App Router, Pages Router, Expo Router, React Router)
- File organization (feature-based, type-based, flat)
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.
- 9d ago First seen · 159 lines · 0 tokens per session scan A 5dd10ba94e8e
gsp-design-system is a skill published in the GitHub repository jubscodes/get-shit-pretty (54 stars, last pushed 3mo ago), licensed MIT. It costs nothing until one of its globs matches a file; then it loads 1,616 tokens. 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
antv-x6-editor
A skill for creating and troubleshooting interactive diagrams with AntV X6, a JavaScript engine for editors made of connected nodes and lines. It supports diagram types such as flowcharts, dependency graphs, entity-relationship diagrams, and organization charts.
infographic-creator
Create beautiful infographics based on given text content. Use when users request to create infographics.
icon-retrieval
Search icons through HTTP API and retrieve SVG strings with curl.
ppt-orchestrator
A dispatcher for creating presentations, slide decks, long images, and weekly reports. It chooses a visual style and output format, then sends the work to a more specialised add-on.
zhongguose-html-skill
An HTML-only presentation system using traditional Chinese colours and Chinese-style visual design. It helps organise source material into a report structure and produces a self-contained HTML file with its assets.
figma-extract-design-system
Extract a design system from vibe-coded production apps that never had one: inventory components, mine de-facto styling into DTCG tokens, scaffold a Storybook package, port components, and optionally round-trip tokens/components into Figma. Use when the user wants to 'extract a design system', 'create a design system…