Blazor UI Conventions & MudBlazor Guidelines

Project-Agnostic Blazor UI Patterns

Placeholders use {Placeholder} syntax - see docs/TEMPLATE_GLOSSARY.md.

Purpose

This skill provides comprehensive guidelines and best practices for developing UI components in Blazor applications. It covers MudBlazor usage, BEM methodology for CSS, theming, component structure, lifecycle, state management, and render modes to ensure consistency, maintainability, and optimal user experience.

When This Skill Activates

Triggered by:

• Keywords: "blazor", "component", "razor", "mudblazor", "ui", "page", "dialog", "render", "parameter", "css", "theme", "state", "lifecycle"
• File patterns: **/*.razor, **/*.razor.cs, **/*.Client/**/*.cs, **/*.css, **/*.scss
• Content patterns: @page, @inject, <Mud, Parameter, EventCallback, ::deep, ::part, BEM class names.

Blazor Hybrid Architecture