MCP App StoreMCP App Store
from L&G Canopy23
Implementation guide for adding filter button controls in Angular projects using the Canopy design system.
This skill provides a set of best practices and implementation patterns for using filter buttons within the Canopy design system. It ensures that data filtering controls are consistent, accessible, and user-friendly.
Use this skill when implementing filter controls to narrow down data sets in an Angular project that uses the @legal-and-general/canopy library, specifically when deciding between single-selection (radio-style) and multiple-selection (checkbox-style) filter buttons.
LgRadioGroupComponent vs LgCheckboxGroupComponent), HTML implementation examples, and a comprehensive list of UX 'Dos and Don'ts'.Primarily intended for agents assisting with Angular development and frontend UI implementation using the Canopy design system.
This skill has not been reviewed by our automated audit pipeline yet.
Canopy Heading — Best Practices
Guidance for using the LgHeadingComponent from @legal-and-general/canopy when headings must be rendered at a dynamic semantic level.
Canopy v20 to v21 Migration Guide
Automates the migration of Angular projects from Canopy v20 to v21 by applying breaking changes to components, directives, and CSS variables.
Clerk Vue Patterns
Vue 3 integration patterns for Clerk: composables, router guards, and Pinia auth store integration.
React Development Expert
Provides authoritative React guidance on hooks, state patterns, Server Components, performance optimization, and common architectural patterns.
Office & Design Toolkit
Comprehensive toolkit for processing and producing DOCX, PPTX, XLSX and PDF files plus design guidance and quality checks for professional office documents and
ClearShot — Screenshot UI Analysis
Structured UI screenshot analysis using a 5×5 spatial grid, full element inventory, and design system extraction. Escalates to full implementation blueprint whe
Colorize — Strategic UI Color Introduction
Introduce purposeful color to monochromatic interfaces to improve hierarchy, meaning, and visual engagement while preserving accessibility.
DAUB UI
A drop-in CSS+JS component library with 70+ carefully designed components and 20 theme families for fast, consistent UI building.
dotLottie Web
Guidelines and patterns for implementing performant dotLottie/Lottie animations on the web (vanilla JS and React), including workers, state machines, and themin
React Context Setup
Automates guidance and code patterns for setting up React Context, providing step-by-step configuration and best-practice examples for frontend projects.