
Umbraco Icons
This handles custom icon registration in Umbraco's backoffice using the official extension system. You'd use it when building Umbraco packages that need branded or custom SVG icons beyond the default set. It pulls fresh documentation before generating code, which matters since Umbraco's extension API changes between versions. The workflow is straightforward: it fetches the latest docs, asks what icons you need, then generates the manifest and TypeScript files with proper lazy loading. The source includes references to working examples in the Umbraco CMS repo, so you're not guessing at patterns. Good for package authors who want icons that match their brand without digging through backoffice documentation.
- skills.sh installs
- 397
- GitHub stars
- 27
- last updated
- Aug 21, 2026
Install
$ npx -y skills add umbraco/umbraco-cms-backoffice-skills --skill umbraco-icons --agent claude-codeInstalls into .claude/skills of the current project.
Files
Umbraco Icons
What is it?
Icons are custom visual elements that extension authors can register for use throughout the Umbraco backoffice. Custom icons are registered through the manifest and can then be used in any extension that accepts an icon property. Icons are defined as SVG content exported from JavaScript modules.
Documentation
Always fetch the latest docs before implementing:
- Main docs: https://docs.umbraco.com/umbraco-cms/extend-your-project/backoffice-extensions/extending-overview/extension-types/icons
- Foundation: https://docs.umbraco.com/umbraco-cms/extend-your-project/backoffice-extensions/foundation
- Extension Registry: https://docs.umbraco.com/umbraco-cms/extend-your-project/backoffice-extensions/extending-overview/extension-registry
Reference Example
The Umbraco source includes a working example:
Location: /Umbraco-CMS/src/Umbraco.Web.UI.Client/examples/icons/
This example demonstrates how to register and use custom SVG icons. Study this for production patterns.
Workflow
- Fetch docs - Use WebFetch on the URLs above
- Ask questions - What icons needed? SVG source available?
Sponsors
Details
- Repository
- github.com/umbraco/umbraco-cms-backoffice-skills
- Categories
- Documentation, .NET & C#
- First seen
- Jun 3, 2026
More from umbraco/umbraco-cms-backoffice-skills
All 76- Umbraco Package View397
- Umbraco Property Action397
- Umbraco Property Editor Schema397
- Umbraco Review Checks397
- Umbraco Sections397
- Umbraco Block Editor Custom View396
- Umbraco Bundle396
- Umbraco Collection396
- Umbraco Current User Action396
- Umbraco Entity Actions396
- Umbraco File Upload Preview396
- Umbraco Picker Data Source396
- Umbraco Collection Action395
- Umbraco Global Context395
- Umbraco Kinds395
- Umbraco Property Value Preset395
- Umbraco Conditions394
- Umbraco Menu394
- Umbraco Search Provider394
- Umbraco Manifest Picker393
- Umbraco Preview App Provider393
- Umbraco Search Result Item393
- Umbraco Sorter393
- Umbraco Monaco Markdown Editor Action392