material-icons / material-symbols

GitHub npm:@xpadev-net/material-symbols npm:@xpadev-net/material-icons

Googleが提供している Material Symbols and Icons をReactコンポーネント化したライブラリです

インストール

npm install @xpadev-net/material-icons
npm install @xpadev-net/material-symbols

yarn add @xpadev-net/material-icons
yarn add @xpadev-net/material-symbols

pnpm add @xpadev-net/material-icons
pnpm add @xpadev-net/material-symbols

使い方

各アイコンはnamed exportされていて、アイコン名は <アイコン名><Style>Icon となっています
例: OutlinedのHomeというアイコン → HomeOutlinedIcon

propsはSVG標準のpropsに加え、colorを指定でき、colorはstyle属性のfillプロパティとして適用されます

例

import { ArrowBackOutlinedIcon } from "@xpadev-net/material-icons";

const Component = () => {
  return (
    <div>
      <ArrowBackOutlinedIcon color={"red"}/>
    </div>
  );
};

ライセンス

アイコンは ApacheLicense の元で提供されています
このライブラリ自体はMITライセンスで公開しています