Umbraco Package View

Generates the boilerplate for custom UI panels that appear when users click on installed packages in Umbraco's backoffice. You get a manifest with the packageView type and either a Lit or vanilla JS element that renders in a modal context. The key detail is matching meta.packageName to your umbraco-package.json so Umbraco knows which view to show. The skill pulls from official docs before generating code, which matters since Umbraco's extension system changes between versions. Most useful when you're building a package that needs configuration UI or wants to display package information beyond what the default view provides.

skills.sh installs: 397
GitHub stars: 27
last updated: Aug 21, 2026

View on GitHub

Install

$ npx -y skills add umbraco/umbraco-cms-backoffice-skills --skill umbraco-package-view --agent claude-code

Installs into .claude/skills of the current project.

Files

Umbraco Package View

What is it?

Package Views provide custom UI panels for installed packages in Umbraco. They appear in the Packages section and allow package developers to create dedicated configuration or information pages for their packages. When a user clicks on an installed package, the package view is displayed as a modal or panel.

Documentation

Always fetch the latest docs before implementing:

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
Umbraco Element: https://docs.umbraco.com/umbraco-cms/extend-your-project/backoffice-extensions/foundation/umbraco-element

Related Foundation Skills

Umbraco Element: Base class for creating UI components
- Reference skill: umbraco-umbraco-element
Modals: Package views are displayed in modal context
- Reference skill: umbraco-modals