angular-material-19

Name: angular-material-19
Availability: InStock
Author: Avvale

Integrate Angular Material 19 components with Material 3 theming and CDK patterns.

1|Updated Jun 20, 2022

Search Tags:#theming #angular #drag-drop #cdk #material-19 #angular-material #timepicker

Ready to run

npx skills add https://github.com/avvale/aurora-front --skill angular-material-19

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: angular-material-19
Source: https://github.com/avvale/aurora-front/tree/main/.claude/skills/angular-material-19
Command: npx skills add https://github.com/avvale/aurora-front --skill angular-material-19

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill helps teams quickly adopt Angular Material 19 by consolidating guidance on components, theming, and CDK patterns, reducing time spent on configuration and trial-and-error.

Core Features & Use Cases

Quick-start patterns for integrating Material 19 components, including timepicker, 2D drag-and-drop, and theming with CSS variables.
Guidance on building responsive, accessible UIs with Material 3 theming and dialog patterns.
Use case: migrate an existing app to Material 19 and implement a dark mode toggle with signals-based patterns.

Quick Start

Install Angular Material 19 in your project, then import and configure modules like MatButtonModule, MatTimepickerModule, and DragDropModule to begin building a Material 19 UI.

Frequently Asked Questions about angular-material-19

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

FAQPage Schema

How do I implement a timepicker in Angular Material 19?▼

You can implement a timepicker in Angular Material 19 by importing MatTimepickerModule into your project. This skill provides quick-start patterns for integrating the timepicker component into Angular forms.

What's the best way to add dark and light theming to an Angular app?▼

The best way to add dark and light theming is using Material 3 theming with CSS variables. This skill provides guidance on implementing a dark mode toggle using signals-based patterns for responsive UI.

How do I set up 2D drag-and-drop in Angular?▼

You set up 2D drag-and-drop by importing DragDropModule from the Angular CDK. This skill encapsulates best practices for applying CDK patterns to enable drag-and-drop functionality in your projects.

Does this Angular Material 19 skill require any external tools beyond npm?▼

No, this skill does not require external tools beyond typical npm or yarn setup. You only need a standard Angular project with @angular/material@19 installed to begin integrating components and theming.

How do I migrate an existing app to Angular Material 19?▼

To migrate an existing app to Angular Material 19, install the updated package and apply Material 3 theming. This skill reduces configuration trial-and-error by consolidating component and dialog patterns.