UI component infrastructure and Material Design components for mobile and desktop Angular web applications.

Optimized for Angular. Built by the Angular team to integrate seamlessly with Angular.

Angular Material comprises a range of components which implement common interaction patterns according to the Material Design specification. Form Controls Controls that collect and validate user input.

Angular Material buttons are native <button> or <a> elements enhanced with Material Design styling and ink ripples.

The mat-table provides a Material Design styled data-table that can be used to display rows of data. This table builds on the foundation of the CDK data-table and uses a similar interface for its data input and template, except that its element and …

The MatDialog service can be used to open modal dialogs with Material Design styling and animations.

For existing apps, follow these steps to begin using Angular Material. link Step 1: Install Angular Material and Angular CDK. You can use either the npm or yarn command-line tool to install packages. Use whichever is appropriate for your project in the examples below. link NPM npm install --save @angular/material @angular/cdk link Yarn yarn add ...

Material stepper builds on the foundation of the CDK stepper that is responsible for the logic that drives a stepped workflow. Material stepper extends the CDK stepper and has Material Design styling. link Stepper variants. There are two stepper components: mat-horizontal-stepper and mat-vertical-stepper. They can be used the same way.

link <input> and <textarea> attributes . All of the attributes that can be used with normal <input> and <textarea> elements can be used on elements inside <mat-form-field> as well. This includes Angular directives such as ngModel and formControl.. The only limitation is that the type attribute can only be one of the values supported by matInput.. link Supported <input> types

Angular Material comes prepackaged with several pre-built theme css files. These theme files also include all of the styles for core (styles common to all components), so you only have to include a single css file for Angular Material in your app.