import { Icon } from '@fidely-ui/react/icon'
import { FaEarthAfrica } from 'react-icons/fa6'

export const IconBasic = () => {
  return (
    <Icon color="orange.9" size="lg">
      <FaEarthAfrica />
    </Icon>
  )
}

import { Icon } from '@fidely-ui/react/icon'
import { BsGithub } from 'react-icons/bs'

export const ReactIcon = () => {
  return (
    <Icon size="lg" color="amber.10">
      <BsGithub />
    </Icon>
  )
}

import { Icon } from '@fidely-ui/react/icon'

export const IconSvg = () => {
  return (
    <Icon size="md" color="crimson.9">
      <svg viewBox="0 0 24 24" fill="currentColor">
        <path d="M12 21s-6.716-4.35-9.33-7.364C.596 11.29.97 7.9 3.757 6.327c1.86-1.07 4.243-.53 5.72 1.02L12 9.88l2.523-2.534c1.477-1.55 3.86-2.09 5.72-1.02 2.787 1.573 3.16 4.964 1.087 7.31C18.716 16.65 12 21 12 21z" />
      </svg>
    </Icon>
  )
}