Icon Fonts

import React from 'react';
const Dripicons = () => {
  return <i className="dripicons dripicons-[icon-name]" />
}

export default Dripicons;

import React from 'react';
const MaterialIcons = () => {
  return (
    <>
        <i className="material-icons">{Icon_Name}</i>             // Filled 
        <i className="material-icons-outlined">{Icon_Name}</i>    // Outlined 
        <i className="material-icons-round">{Icon_Name}</i>       // Round 
        <i className="material-icons-sharp">{Icon_Name}</i>       // Sharp 
        <i className="material-icons-two-tone">{Icon_Name}</i> 
    </>
  )
}

export default MaterialIcons;

import React from 'react';
import { Camera } from "react-feather";

const FeatherIcons = () => {
  return (
    <>
        <Camera /> // Without props
        <Camera color="red" size={48} />  // With props 
    </>
  )
}

export default FeatherIcons;

import React from 'react';
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';

const FontAwesomeIcons = () => {
  return <FontAwesomeIcon icon="icon_name" />
}

export default FontAwesomeIcons;

import React from 'react';
const RemixIcons = () => {
  return <i className="ti-[icon_name]" />
}

export default RemixIcons;

import React from 'react';
const LineAwesomeIcons = () => {
  return <i className="las la-[icon_name]" />
}

export default LineAwesomeIcons;

import React from 'react';
const FlagIcons = () => {
  return <i className="flag-icon flag-icon-in" />
}

export default FlagIcons;

import React from 'react';
const Emoji = () => {
  return <i className="em em-[icon_name]" />
}

export default Emoji;

import React from 'react';
const BootstrapIcons = () => {
  return <i className="bi bi-[icon_name]" />
}

export default BootstrapIcons;