Categories
React Answers

How to import React Material UI icons?

Spread the love

Sometimes, we want to import React Material UI icons.

In this article, we’ll look at how to import React Material UI icons.

How to import React Material UI icons?

To import React Material UI icons, we’ve to install the @material-ui/icons package.

Then we can import icons from it.

To install it, we can run npm install @material-ui/icons with NPM or run yarn add @material-ui/icons with Yarn.

Then we can import an icon and render it with:

import React from "react";
import { DeleteForever } from "@material-ui/icons";

export default function App() {
  return (
    <div>
      <DeleteForever />
    </div>
  );
}

We imported the DeleteForever icon with:

import { DeleteForever } from "@material-ui/icons";

And then we rendered it in App with <DeleteForever />.

Conclusion

To import React Material UI icons, we’ve to install the @material-ui/icons package.

Then we can import icons from it.

To install it, we can run npm install @material-ui/icons with NPM or run yarn add @material-ui/icons with Yarn.

By John Au-Yeung

Web developer specializing in React, Vue, and front end development.

Leave a Reply

Your email address will not be published. Required fields are marked *