angular-best-practices-material
Angular Material and CDK rules for component usage, theming, and testing. Use with the core angular-best-practices skill for comprehensive Angular coverage.
Tech stack
Works with
Agent Skills format with YAML frontmatter. Claude Code reads it as-is.
--- name: "angular-best-practices-material" description: "Angular Material and CDK rules for component usage, theming, and testing. Use with the core angular-best-practices skill for comprehensive Angular coverage." license: "MIT" --- # Angular Material Best Practices Angular Material and CDK rules for component usage, theming, and testing. Use with the core [angular-best-practices](https://skills.sh/alfredoperez/angular-best-practices/angular-best-practices) skill for comprehensive Angular coverage. ## Links - [Core Skill: angular-best-practices](https://skills.sh/alfredoperez/angular-best-practices/angular-best-practices) - [Browse All Skills](https://skills.sh/alfredoperez/angular-best-practices) - [GitHub Repository](https://github.com/alfredoperez/angular-best-practices) ## When to Apply - Importing and configuring Material components - Setting up M3 theming with design tokens - Using CDK utilities for overlays, drag-and-drop, or virtual scrolling - Writing tests for Material components ## Rules | Rule | Impact | Description | |------|--------|-------------| | Import Material Modules Selectively | MEDIUM | Tree-shake unused components with standalone imports | | Use Angular Material Theming System | MEDIUM | M3 theme API with CSS custom properties | | Use CDK Utilities Over Custom Implementations | MEDIUM | Battle-tested overlays, virtual scroll, and a11y primitives | | Use Test Harnesses for Material Components | HIGH | Stable tests that survive internal DOM changes | ## Install Install from [skills.sh/alfredoperez/angular-best-practices](https://skills.sh/alfredoperez/angular-best-practices): - Core skill: [angular-best-practices](https://skills.sh/alfredoperez/angular-best-practices/angular-best-practices) - This add-on: [angular-best-practices-material](https://skills.sh/alfredoperez/angular-best-practices/angular-best-practices-material)
More Frontend Frameworks skills
frontend-design
anthropics/skills
Guidance for distinctive, intentional visual design when building new UI or reshaping an existing one. Helps with aesthetic direction, typography, and making choices that don't read as templated defaults.
design-taste-frontend
leonxlnx/taste-skill
Anti-slop frontend skill for landing pages, portfolios, and redesigns. The agent reads the brief, infers the right design direction, and ships interfaces that do not look templated. Real design systems when applicable, audit-first on redesigns, strict pre-flight check.
hyperframes-creative
heygen-com/hyperframes
Non-animation creative direction for HyperFrames videos. Use for design spec (frame.md / design.md) handling, palettes, typography, narration, beat planning, audio-reactive visuals, composition patterns, and brand / style decisions. For atomic motion patterns and scene blueprints, use hyperframes-animation.
