[React] Icon 사용하기 (mui-icon, react-icons, @tabler-icons)

이경은·2022년 1월 17일
0
post-custom-banner

1. @mui/icons-material

1) install

// with npm
npm install @mui/icons-material

2) usage

import MenuIcon from '@mui/icons-material/Menu';

<MenuIcon sx={{ fontSize: '30px' }} color="action" />

2. react-icons

1) install

npm install react-icons --save // npm

2) usage

import { FaFan } from 'react-icons/fa';

<FaFan size="30" />

참조

3. @tabler-icons

1) install

npm i @tabler/icons

2) usage

// assets
import { IconDashboard, IconDeviceAnalytics, IconHeartRateMonitor } from '@tabler/icons';

// constant
const icons = {
    IconDashboard,
    IconDeviceAnalytics,
    IconHeartRateMonitor
};

children: [
        {
            id: 'default',
            title: 'Control',
            type: 'item',
            url: '/dashboard/default',
            icon: icons.IconDashboard,
            breadcrumbs: false
        },
profile
Web Developer
post-custom-banner

0개의 댓글