umbraco-cms-backoffice-skills

Umbraco Backoffice Skills Marketplace

Experimental Beta: This project is an exploration of what's possible with Skills for Umbraco. It's evolving as we learn what works best.

A Claude Code plugin marketplace with 66 skills for Umbraco backoffice customization and testing.

Quick Start

Add the marketplace:

/plugin marketplace add umbraco/Umbraco-CMS-Backoffice-Skills

Install the plugins:

# Backoffice extension skills (58 skills)
/plugin install umbraco-cms-backoffice-skills@umbraco-backoffice-marketplace

# Testing skills (8 skills) - optional but recommended
/plugin install umbraco-cms-backoffice-testing-skills@umbraco-backoffice-marketplace

---

Install for Other Editors (Cursor, GitHub Copilot, Windsurf, and more)

These skills use the open SKILL.md format, which is now supported natively by multiple AI coding tools. You can install them into any supported editor using the Vercel Skills CLI.

Important: Always use the -a flag to target your editor, otherwise skills will be symlinked into every supported agent directory.

Install all skills for your editor:

# For Cursor
# For Cursor
npx skills add umbraco/Umbraco-CMS-Backoffice-Skills --skill '*' -a cursor

# For GitHub Copilot
npx skills add umbraco/Umbraco-CMS-Backoffice-Skills --skill '*' -a github-copilot

# For Windsurf
npx skills add umbraco/Umbraco-CMS-Backoffice-Skills --skill '*' -a windsurf

Or install each skill set separately:

# Backoffice extension skills (58 skills)
npx skills add https://github.com/umbraco/Umbraco-CMS-Backoffice-Skills/tree/main/plugins/umbraco-backoffice-skills/skills -a cursor

# Testing skills (8 skills) - optional but recommended
npx skills add https://github.com/umbraco/Umbraco-CMS-Backoffice-Skills/tree/main/plugins/umbraco-testing-skills/skills -a cursor

# Install specific skills
npx skills add umbraco/Umbraco-CMS-Backoffice-Skills --skill umbraco-dashboard --skill umbraco-tree -a cursor

Editor Requirements

Editor	Minimum Version	Skills Path
Cursor	2.4+ (January 2026)	.cursor/skills/
GitHub Copilot (VS Code)	VS Code 1.109+ (January 2026)	.github/skills/
GitHub Copilot (Coding Agent)	Supported	.github/skills/
Windsurf	Current	.windsurf/skills/
Claude Code	Current (use Quick Start above)	.claude/skills/

All of these editors load skills on-demand — only the skill relevant to your current task is loaded into context, so installing all 66 skills won't affect performance.

---

Getting Started Skills

These skills are your entry points for Umbraco backoffice extension development. Start here.

umbraco-quickstart - Quick Setup

Start here if you're new. Sets up everything in one command and guides you through planning, building, and validating your extension.

# Full setup with custom credentials
/umbraco-quickstart MyUmbracoSite MyExtension --email a@a.co.uk --password Admin123456

# With default credentials (admin@test.com / SecurePass1234)
/umbraco-quickstart MyUmbracoSite MyExtension

# Just instance name - will prompt for extension name
/umbraco-quickstart MyUmbracoSite

# No arguments - detects existing or prompts for names
/umbraco-quickstart

This skill follows a PLAN → BUILD → VALIDATE workflow:

1. Setup - Create Umbraco instance and extension (if needed), register extension
2. Plan - Enter plan mode with ASCII wireframes, identify extension types, map data flow
3. Build - Generate code using identified sub-skills
4. Review - Auto-run umbraco-extension-reviewer to catch and fix issues
5. Validate - Auto-validate in browser (if Playwright MCP or browser automation available) or provide manual test steps

---

Manual Setup

If you prefer to set things up step by step:

1. Create an Umbraco Instance

Use the package-script-writer skill to create an Umbraco instance using the PSW CLI.

/package-script-writer MyProject

Thanks to Paul Seal (@prjseal) for his hard work on the PSW CLI.

2. Create an Extension

Use umbraco-extension-template to create a new extension project:

/umbraco-extension-template MyFeature

Or manually:

dotnet new install Umbraco.Templates
dotnet new umbraco-extension -n MyExtension -ex
cd MyExtension/Client && npm install && npm run watch

3. Register the Extension

Use umbraco-add-extension-reference to register your extension with the Umbraco project:

/umbraco-add-extension-reference MyExtension