Guide · Agent skill

How to use the Create Canvas Extension agent skill

Updated 2026-10-29 · written with AI from the project's own documentation and checked against our catalogue data

The create-canvas-extension skill is an agent skill: a SKILL.md instruction file that teaches an AI agent a specific multi-step task. This one helps maintainers and contributors add a new canvas extension to the github/awesome-copilot repository, creating the right folders, a plugin.json manifest and plugin registrations. After this guide you will know what the skill does, how to install it, how to ask for it, and what it needs before it runs.

Create Canvas Extensiongithub/awesome-copilot · MIT Download the skill

Quick start

1Get the repository. Check out github/awesome-copilot locally, since the skill only works inside that repository.
2Install the skill. Unzip the downloaded ZIP into ~/.claude/skills/ or a project's .claude/skills/ folder, or upload it under Settings → Capabilities → Skills.
3Ask for the extension. Make a request such as creating a new canvas extension, and give the extension ID and description.
4Answer the questions. Provide the version, author, keywords, preview image and parent plugin if the agent asks for them.
5Review the created files. Check the new extensions/ and plugins/ folders and any updated parent plugin.json.
6Run the validation commands. Run npm run plugin:validate, npm run build and npm run website:data and fix any reported errors.

What the skill makes the agent do

The skill is limited to the github/awesome-copilot repository. Canvas extensions are reusable source components kept under extensions/, while shippable plugin manifests go under plugins/. Extensions do not get a plugin.json under extensions/.

Before creating files, the agent asks for any missing details: the extension ID (lowercase kebab-case), description, version (default 1.0.0), author, keywords (maximum 10), license (default MIT), a preview image at assets/preview.png, and the parent plugin if the extension belongs to one. It then creates the folders and manifest, and registers the extension in each plugin that should ship it.

Install the skill in Claude

Download the ZIP from the skill's page on this directory and unzip it. The skill is a single file named SKILL.md. For a personal install, place the unzipped folder in ~/.claude/skills/. For a single project, place it in that project's .claude/skills/ folder.

You can also upload the skill in the Claude apps under Settings → Capabilities → Skills.

Personal: ~/.claude/skills/
Project: .claude/skills/ inside your project
Claude apps: Settings → Capabilities → Skills

Trigger the skill with natural requests

You do not need a special command. Ask in plain language that matches the skill's description, such as scaffolding a new canvas extension, creating its plugin.json, adding an extension to one or more plugins, or migrating extension metadata. The agent should then load the skill and start by inspecting the repository and asking for missing values.

Create a new canvas extension called my-canvas-tool in awesome-copilot.
Add the extension my-canvas-tool to the plugins for docs and testing.
Migrate the existing canvas extension manifest for my-canvas-tool into the plugins folder.

Create the files and register the plugin

For a new standalone plugin, the skill creates extensions/<extension-id>/ with extension.mjs and assets/preview.png, plus plugins/<extension-id>/ with plugin.json and README.md. The manifest uses the Agent Plugins schema, sets the repository and MIT license, and points the copilot logo at assets/preview.png.

For an extension that belongs to an existing plugin, the skill does not copy source into that plugin. It adds ./extensions/<extension-id> to that plugin's extensions.com.github.awesome-copilot.extensions list, keeping paths sorted and unique.

Do not add agents, commands, hooks or skills at the manifest top level.
MCP servers are declared in mcp.json at the plugin root, not in plugin.json.
If you lack implementation details, the skill leaves an explicit TODO rather than inventing behaviour.

Validate the result

The skill finishes by running three commands in the repository and then reports the created paths, the plugins that ship the extension, and any missing assets or TODOs.

npm run plugin:validate
npm run build
npm run website:data

Migrate an existing extension

If an extension already has its own manifest, the skill moves it to plugins/<extension-id>/plugin.json, updates it to the namespace-based extensions.com.github.copilot.logo shape, removes the old manifest from extensions/<extension-id>, registers the extension in any parent plugin, and runs the validation commands.

What people use it for

Scaffolding a new standalone canvas plugin with its source folder and plugin.json.
Adding an existing canvas extension to a second plugin without copying its source.
Moving an older extension manifest into the namespaced plugin format.
Checking that a planned extension ID does not clash with an existing folder.

Frequently asked questions

How do I install the create-canvas-extension skill?

Download the ZIP from this page and unzip it into ~/.claude/skills/ for personal use or into a project's .claude/skills/ folder. You can also upload it in the Claude apps under Settings → Capabilities → Skills.

What do I need to use this skill?

You need the github/awesome-copilot repository checked out locally, Node.js and npm to run the validation and build scripts, and a preview image at assets/preview.png that you supply.

Is the create-canvas-extension skill free and what is its licence?

The skill's source is licensed under MIT, according to the item details on this page. Check the repository's license file for the full terms.

Does this skill work outside the awesome-copilot repository?

No. The skill says it applies only to github/awesome-copilot, and it may create files that fail validation if the repository layout differs.

Does the skill use the network or run scripts?

It runs scripts, specifically npm run plugin:validate, npm run build and npm run website:data. It does not use the network, according to this page's assessment.

What should I do if validation fails?

Read the error output from npm run plugin:validate, check that plugin.json follows the rules (no agents, commands, hooks or skills at the top level, and no x-awesome-copilot or standalone fields), then rerun the three commands.

New agent skills, repos and AI tools — every week

The best new skills and open-source projects, the fastest-growing repos, and one free prompt. Five minutes to read. Unsubscribe anytime.

Our verdict

This skill suits maintainers and contributors adding a canvas extension to github/awesome-copilot, or developers moving an existing manifest into the repository's namespaced format. If you are working in another project or want a general-purpose skill, pick something else, because this one only fits that repository layout.

Download the skill