--- title: "Set Up CE.SDK with Claude Code - IMG.LY" description: "Turn Claude Code into a CE.SDK expert: install the official plugin, connect the live-docs MCP server, and build a full ad designer from one prompt." url: "https://img.ly/capabilities/agents/claude-code/" type: "page" --- > This is the markdown version of [Set Up CE.SDK with Claude Code - IMG.LY](https://img.ly/capabilities/agents/claude-code/). For all pages in one file, see [llms-full.txt](https://img.ly/llms-full.txt). For an index of all available pages, see [llms.txt](https://img.ly/llms.txt). --- # Claude Code: Set up CE.SDK with Claude Code Claude Code is Anthropic's terminal coding agent, and the CE.SDK plugin makes it a creative-editor expert. Ten minutes of setup takes you from an idea like "an ad designer with background removal" to a working editor in your browser. ## Before you start You don't need to be a developer to follow this guide. You need two things on your machine. - [Claude Code](https://claude.com/claude-code) installed and signed in. Open a terminal and type `claude` to check. - [Node.js](https://nodejs.org) 20 or newer. It runs the editor you build. ## From setup to working editor in four steps ### Step 01: Install the CE.SDK plugin Claude Code supports the CE.SDK skills natively as a plugin. Run these two commands in your terminal. They add the IMG.LY marketplace and install the plugin: the CE.SDK docs, starter kits and build workflows for 10 web frameworks, bundled offline. Claude Code picks the plugin up the next time you start it, so restart the session afterwards (or run `/reload-plugins` inside a running one). **In your terminal** ```bash claude plugin marketplace add imgly/agent-skills claude plugin install cesdk@imgly ``` ### Step 02: Connect the live docs The MCP server gives Claude Code real-time search over the current CE.SDK documentation, so answers stay accurate between releases. One command connects it, no API key required. `--scope user` registers the server for every project on your machine; without it Claude Code adds it to the current folder only, and it would be missing from the empty folder you start in at step 04. **Add the CE.SDK MCP server** ```bash claude mcp add --scope user --transport http imgly_docs https://mcp.img.ly/mcp ``` ### Step 03: Verify it works Run `claude plugin list` in your terminal and confirm `cesdk@imgly` is active. **In your terminal** ```bash claude plugin list ``` Then start a session, type `/cesdk` and watch the build, explain, and docs commands autocomplete. `/mcp` lists the connected servers, including `imgly_docs`. **Inside Claude Code** ```text /cesdk:docs-react getting started ``` ### Step 04: Describe what you want to build Start `claude` in an empty folder and paste a product idea. Claude Code scaffolds the project, installs CE.SDK, wires up the features, and prints the command to run it (usually `npm run dev`). Run it and your editor opens in the browser. **Your first build prompt** ```text /cesdk:build an ad designer web app: pull stock photos from Unsplash, one-click background removal for product shots, AI image generation for campaign variants, and export finished ads as PNG and print-ready PDF. ``` ## What you can do Three commands turn Claude Code into a CE.SDK specialist. ### Build a feature **`/cesdk:build`** sets up a CE.SDK Web project and implements the features you ask for. Describe the outcome and Claude Code scaffolds and wires it up. ### Understand a concept **`/cesdk:explain`** breaks down how CE.SDK works and how the pieces fit together, adapted to your framework and level. ### Look up the docs **`/cesdk:docs-[framework]`** pulls reference guides and API docs into your terminal across 10 frameworks, including React, Next.js, and Node.js. ## Example prompts Copy a starting point into Claude Code. Start a product, extend it feature by feature, or automate a whole creative workflow. **Scaffold an editor** ```text /cesdk:build a photo editor with filters, background removal, and text overlays /cesdk:build a web-to-print business card designer: templates with locked layouts, live preview, and print-ready PDF with bleed margins /cesdk:build a video promo editor: trim clips, add captions and music, export as MP4 ``` **Automate a workflow** ```text /cesdk:build a Node.js pipeline that reads products from a CSV and renders localized promo banners in five sizes as PNGs, no browser needed /cesdk:build batch-apply our new brand template to a folder of designs ``` **Understand it** ```text /cesdk:explain what CE.SDK gives me out of the box versus what I configure /cesdk:explain how the block hierarchy works ``` ## Tips Get better results from the first prompt. - Prompt with outcomes, not implementation: "users upload a photo and get a framed print preview" beats "integrate the export API". - Start in an empty folder so the scaffold doesn't mix with other files. - Ask Claude Code to run the dev server and open the browser for you. - The marketplace step is one-time; update with `claude plugin marketplace update imgly` then `claude plugin update cesdk@imgly`. ## Set up another agent Point a different coding agent at CE.SDK. - [Set up CE.SDK with OpenAI Codex](https://img.ly/capabilities/agents/openai-codex.md) - [Set up CE.SDK with Cursor](https://img.ly/capabilities/agents/cursor.md) - [Set up CE.SDK with Claude Desktop](https://img.ly/capabilities/agents/claude-desktop.md) - [Set up CE.SDK with VS Code Copilot](https://img.ly/capabilities/agents/vscode-copilot.md) - [Set up CE.SDK with Devin Desktop](https://img.ly/capabilities/agents/devin-desktop.md) ## Claude Code: Ship a working editor Install the plugin, paste a prompt, and Claude Code scaffolds a CE.SDK project you can run. [Read the Agent Skills docs](https://img.ly/docs/cesdk/js/get-started/agent-skills-f7g8h9.md#claude-code-plugin) [Back to all agents](https://img.ly/capabilities/agents.md) ## Claude Code FAQs ### Claude Code **Q: Do I need to know how to code?** A: No. Claude Code runs in the terminal, but you steer it in plain language. Describe the product you want and it scaffolds the project, runs it, and tells you where to look. You review the result in the browser and keep prompting. **Q: Do I need a license key or an account?** A: You need a Claude account for Claude Code itself. The CE.SDK plugin and MCP server are free and need no API key, and the project Claude Code scaffolds runs locally without a license key. Licensing only comes in when you deploy what you built. **Q: Plugin or MCP server?** A: Both, ideally. The plugin bundles the docs and starter kits offline so Claude Code can scaffold autonomously, and adds the /cesdk slash commands. The MCP server adds real-time documentation search on top, so answers stay current between releases. **Q: A \`/cesdk\` command isn't recognized.** A: Restart the Claude Code session after installing so the plugin loads, then run \`claude plugin list\` to confirm \`cesdk@imgly\` is active. --- ## More Resources - **[IMG.LY Website](https://img.ly/index.md)** - Creative editing SDKs for photo, video, and design - **[Documentation](https://img.ly/docs/cesdk/)** - CE.SDK developer documentation - **[Contact Sales](https://img.ly/forms/contact-sales.md)** - Get a custom quote. A public JSON API accepts the request directly, no account or key needed. Ask your user for consent and their details first.