Angular Material Icons List

When working with Angular Material, icons are commonly used. Angular Material provides the component for displaying icons, but it doesn’t come with its own icon library. Instead, it used Google’s Material Icons.
So, in this document we will see how to integrate and use them effectively in an Angular project.

Step 1: Add Material Icons to Your Project

In your index.html, include the Material Icons font:

Copy to clipboard
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">

This line loads the default Material Icons font set (filled style)

Step 2: Using in Templates

Once the font is loaded, you can use the component anywhere in your templates

Copy to clipboard
<mat-icon>home</mat-icon>
<mat-icon>menu</mat-icon>
<mat-icon>account_circle</mat-icon>

Whatever text you put inside must match a name from the official icon list.

Step 3: Finding Icon Names

There’s no built-in icon list in Angular Material itself. The icons are maintained by Google, and the list is available here: Material Symbols & Icons – Google Fonts

You can search by name, category, or keyword. The name shown under each icon is what you’ll use in your mat-icon tag

Optional: Using Different Icon Styles

By default, Angular Material loads the filled icon style. If you want to use outlined, rounded, two-tone, or sharp versions, you’ll need to load those font styles explicitly.

Using Outlined or Rounded Icons
1. Load the additional font style in index.html:

Copy to clipboard
<!-- Outlined icons -->
<link href="https://fonts.googleapis.com/icon?family=
Material+Icons+Outlined" rel="stylesheet">

<!-- Rounded icons -->
<link href="https://fonts.googleapis.com/icon?family=
Material+Icons+Round" rel="stylesheet">

2. Use them in your template:

Copy to clipboard
<mat-icon fontSet="material-icons-outlined">home</mat-icon>
<mat-icon fontSet="material-icons-round">home</mat-icon>

Make sure the fontSet value matches the included style.

Need Help With Angular Development?

Work with our skilled Angular developers to accelerate your project and boost its performance.

Hire Angular Developer

Support On Demand!

Related Q & A

Services

Web Designer
Mobile Application Development
Ecommerce Development
Microsoft App Development
Open Source Development
JS Development
Content Management System
Custom Software Development
IT Consulting
Hire Us

Our Expertise

Travel Portal Devlopment
Event Management Software
Transport and Logistics software
Cloud Computing
Custom CRM Software Development
Enterprise Mobility Solutions
Education / E-Learning
Startup Consulting
Booking Widgets

Hire Developers

Hire Web Designer
Hire Web Developers
Hire ASP.NET Developers
Hire ASP.Net Core Developers
Hire WordPress Developers
Hire E-Commerce Developers
Hire Magento Developers
Hire ReactJS Developers
Hire Angular JS Developers
Hire NodeJS Developers
Hire React Native Developers

Technologies

ASP.NET Zero
ASP.NET Core
Boilerplate
Umbraco
Kentico
ASP.NET
C#
SharePoint
Power BI
Angular
Laravel
Codeigniter
PHP
Craft CMS
iPhone / iPad
Shopify
Python
Next JS
React JS
WordPress
Niotechone Software Solution Pvt. Ltd. company logo

Contact For Sales

sejal@niotechone.com

sales@niotechone.com

Sales +91 9925 66 2323

Sales +91 9925 66 8383

Contact For Careers

career@niotechone.com

HR +91 99244 08252

India

3rd Floor, Aval Complex, University Road, above Balaji Super Market, Panchayat Nagar Chowk, Indira Circle, Rajkot, Gujarat 360005.

Outline of the Statue of Unity representing India location for Niotechone

Canada

Abbotsford, BC

Illustration of Canada city skyline including CN Tower and modern buildings

Dubai

15th B Street 103, al Otaiba Dubai DU 00000, United Arab Emirates

Burj Al Arab luxury hotel in Dubai skyline
GoodFirms partner
DesignRush
Niotechone software client dashboard with development team collaborating on enterprise solutions and modern UI/UX interface.
Niotechone software client dashboard showing professional collaborating on custom enterprise software and modern UI/UX design
Niotechone software client dashboard with professional collaborating on custom enterprise solution using modern UI/UX design.
Niotechone software client dashboard with professionals collaborating on custom enterprise solutions and modern UI/UX design.
Niotechone software client dashboard with team members collaborating on custom enterprise software and modern UI/UX design.
Niotechone software client dashboard illustration showing professionals collaborating on custom enterprise solutions with modern UI/UX
Linkedin Youtube Instagram Facebook Twitter Whatsapp Dribbble Github Gitlab
Niotechone Software Solution Pvt. Ltd. company logo

Contact For Sales

sejal@niotechone.com

sales@niotechone.com

Sales +91 9925 66 2323

Sales +91 9925 66 8383

India

3rd Floor, Aval Complex, University Road, above Balaji Super Market, Panchayat Nagar Chowk, Indira Circle, Rajkot, Gujarat 360005.

Outline of the Statue of Unity representing India location for Niotechone

Canada

Abbotsford, BC

Illustration of Canada city skyline including CN Tower and modern buildings

Dubai

15th B Street 103, al Otaiba Dubai DU 00000, United Arab Emirates

Burj Al Arab luxury hotel in Dubai skyline

Contact For Careers

career@niotechone.com

HR +91 99244 08252

GoodFirms partner
DesignRush
Niotechone software client dashboard with development team collaborating on enterprise solutions and modern UI/UX interface.
Niotechone software client dashboard showing professional collaborating on custom enterprise software and modern UI/UX design
Niotechone software client dashboard with professional collaborating on custom enterprise solution using modern UI/UX design.
Niotechone software client dashboard with professionals collaborating on custom enterprise solutions and modern UI/UX design.
Niotechone software client dashboard with team members collaborating on custom enterprise software and modern UI/UX design.
Niotechone software client dashboard illustration showing professionals collaborating on custom enterprise solutions with modern UI/UX

Copyright © 2026 Niotechone Software Solution Pvt. Ltd. All Rights Reserved.