Heroicons v1.0

1년 전쯤, 우리는 Tailwind UI와 함께 디자인한 아름다운 UI 아이콘 세트인 Heroicons의 첫 번째 버전을 출시했습니다. 그 이후로 수많은 새로운 아이콘을 추가하고, 전용 웹 경험을 디자인하고 출시했습니다.

오늘 우리는 마침내 450개 이상의 무료 아이콘, 공식 React 및 Vue 라이브러리, 그리고 Figma 에셋을 포함한 Heroicons v1.0을 출시하게 되어 기쁩니다.

​React + Vue 라이브러리

웹사이트에서 직접 필요한 아이콘을 가져오는 것 외에도, 이제 공식 React와 Vue 라이브러리를 설치하여 각 아이콘을 전용 컴포넌트로 쉽고 빠르게 사용할 수 있습니다.

다음은 React를 사용한 예제입니다:

import { BeakerIcon } from '@heroicons/react/solid'

function MyComponent() {
  return (
    <div>
      <BeakerIcon className="h-5 w-5 text-blue-500" />
      <p>...</p>
    </div>
  )
}

더 자세한 내용은 GitHub 문서를 확인하세요.

​Figma Assets

공식 Heroicons Figma 파일을 새로운 Figma 커뮤니티 페이지에 게시했습니다!

이 파일에는 Heroicons의 모든 아이콘이 개별 Figma 컴포넌트로 포함되어 있어, 각 SVG를 수동으로 가져오지 않고도 프로젝트에서 쉽게 사용할 수 있습니다.

바로 사용해보고 싶으신가요? Heroicons 웹사이트 방문 →