Claude

Claude Code

1. 1

   Add the devl MCP server

   From your project root:

   claude mcp add --transport http devl https://devl.dev/mcp

   Add --scope user to have it in every project. There's no sign-in: devl is free and the server is read-only.

2. 2

   Install the devl skill

   mkdir -p .claude/skills/devl && curl -fsSL https://devl.dev/skill/SKILL.md -o .claude/skills/devl/SKILL.md

   The skill tells Claude when to reach for devl, how to install pieces and how to borrow devl's patterns.

3. 3

   Check the connection

   claude mcp list

   devl should show as connected. Inside a session, /mcp lists its four tools.

Claude Desktop and claude.ai

1. 1

   Add a custom connector

   Open Settings → Connectors (on claude.ai, Customize → Connectors), click Add custom connector, name it devl and use this URL:

   https://devl.dev/mcp

2. 2

   Turn it on in a chat

   Enable devl from the tools menu in a conversation, then ask for what you want to build.

Try asking

• "Use devl to build our sign-in page: find the closest screen and adapt it to our brand."
• "Search devl for a pricing toggle with some motion and add it to the pricing section."
• "What devl pieces would you use for an onboarding checklist? Show me two options."