Framebrick Agent Skills
An agent skill is a small markdown file that tells a coding agent how to work with something. The Framebrick MCP server gives the agent the tools to search and install; the skills tell it in what order to use them and what to watch for. There are three, all free and without an account:
| Skill | What it teaches |
|---|---|
framebrick |
Components: search the registry first, read the props before using one, install with the shadcn CLI, reduced motion, server and client, the shadcn tokens. |
framebrick-blocks |
Page blocks: plan a page from the library, the registry token and what to say when the user has no plan, the block tokens, theming with variables. |
framebrick-templates |
Templates: the six editions and the plan each needs, picking the edition from the stack, reading the edition’s guide before changing anything. |
Install them
Section titled “Install them”One command writes all three into Claude Code’s personal skills folder (~/.claude/skills):
curl -fsSL https://framebrick.co/install | node -Options: --project writes ./.claude/skills for this project only; --dir <folder> writes any folder an agent reads skills
from; --only framebrick-blocks installs one; --dry-run shows what it would write. The script only downloads the
SKILL.md files, so read it first at framebrick.co/install if you like. Restart your agent
afterwards. The list of skills is at framebrick.co/skills/index.json.
To install by hand, download a file and put it at <skills folder>/<name>/SKILL.md:
framebrick,
framebrick-blocks,
framebrick-templates.
Other agents (Cursor, Codex, opencode, Copilot…) keep skills or project instructions in their own place: use --dir with
the folder your agent documents, or copy the text under the front matter into AGENTS.md, .cursor/rules or
.github/copilot-instructions.md. We have only tested the installer’s output, not each agent’s loading.
Commands
Section titled “Commands”With the MCP server connected, three prompts work as commands in clients that show MCP prompts: build (plan a page from
blocks and install it), add (find one item and install it) and fix (check usage against the real props). In Claude Code
they appear as /mcp__framebrick__build and so on. You can also ask in plain language: “Plan a landing page for a branding
studio from Framebrick blocks.”
Keeping them current
Section titled “Keeping them current”The skills are files served from framebrick.co: run the installer again for the latest. They change when our conventions do, not with every new component or block: the agent finds new ones by searching.