🚀 Big News: Socket Acquires Coana to Bring Reachability Analysis to Every Appsec Team.Learn more →
Socket
DemoInstallSign in
Socket
DemoInstallSign in

@angular/material

Package Overview
Dependencies
Maintainers
2
Versions
603
Alerts
File Explorer

Advanced tools

License
Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@angular/material

Angular Material

20.0.0
Source
npm
Version published
Weekly downloads
1.7M
4.55%
Maintainers
2
Weekly downloads
 
Created

What is @angular/material?

The @angular/material package is a UI component library for Angular applications that implements Google's Material Design. It provides a wide range of reusable UI components that are designed to be efficient, accessible, and visually appealing. These components help developers build cohesive, attractive, and functional web applications with less effort.

What are @angular/material's main functionalities?

Form Controls

Form controls are essential for collecting input from the user. @angular/material provides various form controls like input fields, checkboxes, radio buttons, and select dropdowns. The code sample demonstrates how to import and use the MatInputModule for text inputs.

import {MatInputModule} from '@angular/material/input';

@NgModule({
  imports: [MatInputModule]
})
export class MyModule {}

Navigation

Navigation components help users move through the application. This includes menus, side navigation, and toolbars. The code sample shows how to import the MatToolbarModule to use a Material Design toolbar in your application.

import {MatToolbarModule} from '@angular/material/toolbar';

@NgModule({
  imports: [MatToolbarModule]
})
export class MyModule {}

Layout

Layout components assist in structuring the view of an application. @angular/material offers grid lists, cards, and tabs to help organize content. The code sample illustrates the use of MatGridListModule for creating grid layouts.

import {MatGridListModule} from '@angular/material/grid-list';

@NgModule({
  imports: [MatGridListModule]
})
export class MyModule {}

Buttons & Indicators

Buttons and indicators are used for actions and status feedback. This category includes buttons, progress bars, and spinner indicators. The code sample demonstrates importing MatButtonModule to use Material Design buttons.

import {MatButtonModule} from '@angular/material/button';

@NgModule({
  imports: [MatButtonModule]
})
export class MyModule {}

Other packages similar to @angular/material

    ngx-bootstrap

    ngx-bootstrap provides Bootstrap components powered by Angular. It's similar to @angular/material in providing a set of reusable UI components but is based on Bootstrap's design system rather than Material Design.

    primeng

    PrimeNG is a collection of rich UI components for Angular. It offers a wide range of widgets and is comparable to @angular/material in terms of providing components for form controls, tables, overlays, and more. PrimeNG is known for its extensive component library beyond what @angular/material offers.

    ng-zorro-antd

    NG-ZORRO is an Angular UI library based on Ant Design. Similar to @angular/material, it provides a comprehensive suite of UI components that are designed to be modular, lightweight, and easy to use. It differs in its design philosophy, following Ant Design principles instead of Material Design.

Keywords

angular
material
material design
components

FAQs

Package last updated on 28 May 2025

Did you know?

Socket

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install

Related posts

PyPI Package Disguised as Instagram Growth Tool Harvests User Credentials

Research

PyPI Package Disguised as Instagram Growth Tool Harvests User Credentials

A deceptive PyPI package posing as an Instagram growth tool collects user credentials and sends them to third-party bot services.

By Kush Pandya  -  Jun 06, 2025
Socket Now Supports pylock.toml Files

Product

Socket Now Supports pylock.toml Files

Socket now supports pylock.toml, enabling secure, reproducible Python builds with advanced scanning and full alignment with PEP 751's new standard.

By Trevor Norris  -  Jun 05, 2025