[React] React-icon에 Styled Components 적용하기

 

1. React icon, Styled Components 설치

yarn add react-icons styled-components

 

 

 

2. React icon에서 사용할 아이콘 import

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

 

 

 

3. Styled Compoenets를 사용해 아이콘에 스타일 적용

import React from 'react';
import { FaHeart } from 'react-icons/fa';
import styled from 'styled-components';

const Heart = () => {
  return (
    <>
      <StyledIcon />
    <>
  );
};

export default Heart;

const StyledIcon = styled(FaHeart)`
  color: red;
  font-size: 24px;
`;