Umbraco Umbraco Element

This skill helps Claude implement Umbraco backoffice elements using the official UmbElementMixin and UmbLitElement APIs. It fetches current docs before generating code, which matters because Umbraco's customization patterns changed significantly with their Web Components approach. You get context consumption, observable state handling, and localization baked in. The skill distinguishes between using UmbLitElement for Lit components versus applying UmbElementMixin to existing base classes like UI library components. Honest take: it's narrow but solves a real problem if you're extending Umbraco's backoffice, since the mixin pattern and context API aren't immediately obvious from casual reading.

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

View on GitHub

Install

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

Installs into .claude/skills of the current project.

Files

Umbraco Element

What is it?

An Umbraco Element is a Web Component enhancement that simplifies integration with the Umbraco Backoffice through the UmbElementMixin. It provides methods to consume/provide contexts, observe states, handle localization, and host controllers. UmbElementMixin can be applied to any Web Component-compatible base class, while UmbLitElement is a convenience wrapper combining the mixin with Lit.