MaterialDesign screenshot

MaterialDesign

Author Avatar Theme by Templarian
Updated: 20 Jan 2025
11136 Stars

7000+ Material Design Icons from the Community

Overview

Material Design Icons is a repository that includes planning for current and work-in-progress Material Design Icons. It offers a variety of icons converted from Google’s official icon set, providing a resource for developers to enhance the visual appeal of their projects.

Features

  • NPM Installation: Easily install icons using npm commands for webfont, SCSS, JavaScript, TypeScript, ReactJS, SVG, and desktop font.
  • Upgrade Guide: Stay updated on changes and improvements with the provided changelog guide.
  • Contribution Guidelines: Learn how to contribute to the Material Design Icons project and submit icon suggestions via the issue tab.
  • Third-Party Support: Explore guides for integrating third-party plugins or extensions to enhance icon functionality.

Installation

To install Material Design Icons, follow these steps:

  1. For Webfont / SCSS:
    npm install @mdi/font
    npm install MaterialDesign-Webfont
    
  2. For JavaScript / TypeScript:
    npm install @mdi/js
    npm install MaterialDesign-JS
    
  3. For ReactJS:
    npm install @mdi/react
    npm install MaterialDesign-React
    
  4. For SVG / Meta.json:
    npm install @mdi/svg
    npm install MaterialDesign-SVG
    
  5. For Desktop Font:
    npm install MaterialDesign-Font
    

Summary

Material Design Icons repository offers a valuable collection of icons designed to align with Material Design principles. With easy installation using npm commands, developers can seamlessly integrate these icons into their projects. Additionally, the guidelines for contributions and third-party support enhance the usability and customization options for users.