claude-design-patterns
codeclawd/fable-modeEngineering rules and reusable patterns for building polished web UI, React artifacts, slide decks, animations, and device mockups — distilled from…
Scores out of 100 · grade B+
2026-08-17Works
40% of the score100/100
- Loads cleanly: valid frontmatter, required fields present, no dangling references.
Maintained
25% of the score86/100
- no commits in the last 12 weeks
- no license file
Adopted
20% of the score17/100
- 16 stars on the source repo.
Documented
15% of the score74/100
- 611 words with worked examples.
Install
npx skills add codeclawd/fable-mode/claude-design-patternsWhat the check found
| Finding | What it means |
|---|---|
| No license | The repository ships no license file, so the reuse terms are unclear. |
What it says it does
Engineering rules and reusable patterns for building polished web UI, React artifacts, slide decks, animations, and device mockups — distilled from Anthropic's leaked Claude Design agent system prompt. Use ALONGSIDE the frontend-design skill whenever building or iterating on visual web output: single-file React/HTML artifacts, presentation decks, design-variation explorations, or live-tweakable demos. Covers React/Babel pinning, style-collision avoidance, the live-edit "Tweaks" postMessage protocol, starter-component patterns, the ask-first/expose-variations methodology, and the verifier-agent finishing pass.
Also in codeclawd/fable-mode
| Artifact | Score | What the check found | Type | Reach | Last commit |
|---|---|---|---|---|---|
| skill-creatorcodeclawd/fable-mode | No license | Skill | 16 stars | 25 days ago | |
| mcp-buildercodeclawd/fable-mode | No license | Skill | 16 stars | 25 days ago | |
| webapp-testingcodeclawd/fable-mode | No license | Skill | 16 stars | 25 days ago | |
| explore-datacodeclawd/fable-mode | No license | Skill | 16 stars | 25 days ago | |
| grounding-verifiercodeclawd/fable-mode | No license | Subagent | 16 stars | 25 days ago | |
| groundcodeclawd/fable-mode | No license | Skill | 16 stars | 25 days ago |
Other ai & agents skills
Browse all| Artifact | Score | What the check found | Category | Reach | Last commit |
|---|---|---|---|---|---|
| mcp-builderanthropics/skills | No license | AI & agents | 104,949 installs | today | |
| agent-developmentanthropics/claude-plugins-official | clean | AI & agents | 5,901 installs | today | |
| plugin-settingsanthropics/claude-plugins-official | clean | AI & agents | 5,465 installs | today | |
| skill-creatoranthropics/claude-plugins-official | clean | AI & agents | 5,836 installs | today | |
| microsoft-foundrymicrosoft/azure-skills | clean | AI & agents | 544,819 installs | today | |
| claude-apianthropics/skills | No license | AI & agents | 59,236 installs | today |
Put this measurement in your README
A badge carrying how many listings this index holds from the repository and how many pass every static structural check. It reads from this index every time somebody loads your page, so it changes when the measurement changes and there is nothing to keep up to date. Free, no account, and the value is not something you or we can set by hand.
[](https://skillworks.kynth.studio/?q=codeclawd%2Ffable-mode)Would rather not hotlink us? Every badge is also served in shields.io’s endpoint schema, so shields renders the image and your readers never talk to our domain:
Published by Toolproof, the masthead over this index and eight others. The method behind the number is at toolproof.kynth.studio/methodology, and the whole thing is readable as JSON with no key at /api.
