implement-ui

Implement Blazor WebAssembly UI pages using a shared component library.

1|Updated Mar 20, 2026

Search Tags:#ui #accessibility #frontend #components #bootstrap #blazor

Ready to run

npx skills add https://github.com/mamu7211/feirb-mailclient --skill implement-ui

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: implement-ui
Source: https://github.com/mamu7211/feirb-mailclient/tree/main/.claude/skills/implement-ui
Command: npx skills add https://github.com/mamu7211/feirb-mailclient --skill implement-ui

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This skill addresses UI inconsistency and technical debt by enforcing the use of a centralized component library, ensuring that all new features adhere to the project's design system and accessibility standards.

Core Features & Use Cases

Component Enforcement: Automatically guides the implementation of UI using registered primitives like Buttons, Cards, and Icons instead of raw Bootstrap classes.
Accessibility & Responsiveness: Ensures all UI work meets WCAG AA standards and follows responsive design patterns using Bootstrap breakpoints.
Showcase Integration: Mandates the creation of interactive showcase pages for every new component, providing a canonical reference for both developers and AI agents.

Quick Start

Use the implement-ui skill to scaffold a new detail page for the user settings entity following the established anatomy and component registry.

Frequently Asked Questions about implement-ui

High-intent search queries and answers about installing and using this skill.

FAQPage Schema

How do I enforce consistent UI styling across a Blazor WebAssembly project?▼

To enforce consistent UI styling in Blazor WebAssembly, you can standardize development by routing all page creation through a shared component library. This approach replaces raw classes with registered primitives to ensure uniform design.

What is the best way to manage a shared component library for frontend development?▼

The best way to manage a shared component library is to mandate interactive showcase pages for every new UI primitive. This provides a canonical reference for developers and AI agents, ensuring consistent component usage.

Does this UI standardization approach support Bootstrap breakpoints for responsive layouts?▼

Yes, this UI standardization approach supports Bootstrap breakpoints for responsive layouts. It enforces responsive design patterns through the shared component registry while ensuring all interfaces meet WCAG AA accessibility standards.

How do I scaffold a new Blazor page using registered UI components instead of raw Bootstrap classes?▼

To scaffold a new Blazor page using registered UI components, you apply the UI standardization skill to guide implementation. It automatically enforces the use of shared primitives like Buttons and Cards instead of raw Bootstrap classes.

Can I use custom HTML elements instead of the shared component registry when building web interfaces?▼

Using custom HTML elements instead of the shared component registry is discouraged. The standardization process enforces adherence to registered UI primitives to prevent technical debt and maintain accessibility compliance across the web application.