Claude Code
Register the Krafa taste server with Claude Code so it designs against your references instead of its defaults.
Claude Code supports remote MCP servers over HTTP, so there's nothing to install. One command and it's connected.
Setup
Get your token
Open the board you want Claude Code to design from, press ⌘K → Connect AI Agent, and copy the token.
Keep it out of your shell history and any committed file:
export KRAFA_TOKEN="krafa_YOUR_TOKEN"Add the server
claude mcp add --transport http krafa-taste https://app.krafa.ai/api/mcp \
--header "Authorization: Bearer $KRAFA_TOKEN"Add --scope project to write it into .mcp.json for the whole team, or --scope user to make it available in every project on your machine. The default is local to the current project.
If you'd rather write the file directly:
{
"mcpServers": {
"krafa-taste": {
"type": "http",
"url": "https://app.krafa.ai/api/mcp",
"headers": {
"Authorization": "Bearer ${KRAFA_TOKEN}"
}
}
}
}"type": "http" is required in file-based config. Claude Code treats an entry with a url but no type as stdio and refuses to load it, reporting has a "url" but no "type". The CLI command above sets it for you.
${KRAFA_TOKEN} is expanded from your environment, which keeps the secret out of a committed .mcp.json. Team members set their own, so each person's token points at their own board.
Verify
claude mcp listkrafa-taste should show as connected. A project-scoped server sits at Pending approval until you start Claude Code interactively and accept it once.
Inside a session, /mcp shows the same status and lists the three available tools.
Make it automatic
Claude Code reads CLAUDE.md at the project root. One instruction there means you never have to ask for the profile again:
## Design
Before writing or modifying any UI, call `get_taste_profile` from the
krafa-taste MCP server and follow it. For visual work (layout, color,
spacing, motion) also call `get_exemplars` and match what you see.
Do not invent a design language; the profile is the spec.A worked session
Build the empty state for the billing page.
Claude Code calls get_taste_profile, gets back your Typography, Color, Spacing, and Components memories, and calls get_exemplars for the screenshots behind them. What lands is an empty state at your density, in your accent, with your button treatment: a review pass on details rather than a rewrite of the whole look.
When you want to check its reasoning, ask for the citation:
Which taste memory made you choose that heading weight?
Troubleshooting
| Symptom | Cause |
|---|---|
has a "url" but no "type" | Add "type": "http" to the entry |
| Connects, but answers are generic | The tool isn't being called. Ask explicitly, then add the CLAUDE.md rule |
invalid token | Token was rotated or truncated; re-copy it from the board |
| Empty profile | The board has no memories yet. Paste some references |