CODEWITHSUNDEEP
javascriptreactjswebmaterial-ui
Mahmud Munna
Mahmud Munna

Reputation: 11

How can I start using Material UI icons in my REACT project?

I went through the documentation and found that a bit confusing with the terms like "MaterialIcon, SVGIcons, Icons". Here it is

Can any one give a simple understanding of the process, like from installation to using inside a REACT component?

I prefer using Fontawesome (free version). But this time I needed to use Google and Facebook icons inside my projects which were not available in the free version. So I had to explore the alternatives.

//I have tried by the followings: npm install @mui/icons-material @mui/material @emotion/styled @emotion/react

//Imported Material UI icons import GoogleIcon from '@mui/icons-material/Google';

//Inside component {GoogleIcon }

//But It doesn't work

Upvotes: 1

Views: 706

Answers (1)

bezbos.
bezbos.

Reputation: 2374

MaterialUI requires a theme to be setup for its icons to work properly: https://mui.com/material-ui/customization/theming/

Here is a code example:

import { createTheme, ThemeProvider  } from '@mui/material/styles';

const theme = createTheme();

function App() {
  return (
    <ThemeProvider theme={theme}>
      <GoogleIcon />
    </ThemeProvider>
  );
}

Upvotes: 0

Related Questions