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アセット

Figma Communityページで、公式のHeroicons Figmaファイルも公開しました！

Heroiconsのすべてのアイコンが個別のFigmaコンポーネントとして含まれているため、各SVGを手動でインポートせずにプロジェクトで簡単に使用できます。

試してみませんか？ Heroiconsのウェブサイトにアクセス →