Standardize lgColour directive usage and theming across Angular components.
npx skills add https://github.com/Legal-and-General/canopy --skill canopy-colour
Please help me install this Agent Skill. Skill: canopy-colour Source: https://github.com/Legal-and-General/canopy/tree/main/skills/best-practice/colour Command: npx skills add https://github.com/Legal-and-General/canopy --skill canopy-colour
Inconsistent Canopy colour application is reduced by standardising the lgColour directive usage and theming across Angular components, enabling coherent branding and accessible contrast.
Apply the lgColour directive with a chosen colour mode and theme to a sample component to observe consistent visual behavior.
High-intent search queries and answers about installing and using this skill.
To standardise colour theming across Angular components, apply the lgColour directive with a chosen semantic colour mode and matching theme to ensure predictable visual behaviour and accessible contrast across your UI.
The best way to apply accessible colour semantics to Canopy UI components is by using the lgColour and lgColourTheme directives on elements like cards and buttons to maintain visual coherence and defined contrast.
The lgColour directive works for Angular form validation by assigning semantic colour modes like red for errors or green for success, ensuring consistent colour cues across status messages for quick user recognition.
Available semantic colour modes for Canopy design system theming include blue, green, red, and yellow, which can be paired with matching themes such as neutral, neutral-inverse, subtle, and bold for consistent UI.
No specific external dependencies are required to use lgColour directives in your Angular project, as the Skill provides standalone standardised theming guidelines and usage examples for direct implementation.
Yes, you can use Canopy colour theming for different UI modes by applying matching themes like neutral and neutral-inverse, which provide predictable colour semantics and accessible contrast across varying interface contexts.
Legal-and-GeneralStandardize colour modes and themes using the Canopy lgColour directive in Angular.
333-333-333Automate Flutter widget rendering, interaction, and accessibility validation tests.
Legal-and-GeneralGuide Angular developers to implement full-page layouts with the Canopy lg-page component.
Jorge-IvanConfigure Tailwind CSS themes, utilities, and variants directly in CSS files.
