Skip to main content

How to use SVG icon in React with Material UI

Create a SVG component as below

import React from 'react'import SvgIcon from '@material-ui/core/SvgIcon'
const StoreIcon = (props) => (  <SvgIcon width='133' height='133' viewBox='0 0 133 133' {...props}>    <path d='M110.833 22.1666H22.1667V33.25H110.833V22.1666ZM116.375 77.5833V66.5L110.833 38.7916H22.1667L16.625 66.5V77.5833H22.1667V110.833H77.5833V77.5833H99.75V110.833H110.833V77.5833H116.375ZM66.5 99.75H33.25V77.5833H66.5V99.75Z'/>  </SvgIcon>)
StoreIcon.displayName = 'StoreIcon'
export default StoreIcon

Use it in your react component

<StoreIcon style={{ fontSize: 124 }} color='primary'/>