はんこ、鳥居、〒、燃えるゴミ、請求書、診察券。日本で使うアイコン 40 個を、そろったデザインで。MIT ライセンスで商用利用もできます。
日本の現場で必要になるのに、海外のアイコンセットには少ないものを中心に集めています。
印鑑、鳥居、お守り、〒、請求書、診察券、ゴミ分別、地図記号など。
線のみの line と、面に色がのる duotone の 2 スタイル。副色は CSS 変数で変えられます。
文字と同じ色で表示され、ダークモードやテーマ切り替えにもそのまま対応します。
ESM とツリーシェイキングに対応。import したアイコンだけが含まれます。
React、Vue 3、素の JavaScript、SVG スプライト、WordPress のショートコード。
title を付けると読み上げ対象に、付けなければ装飾として扱われます。
使う環境に合わせて、どれか 1 つを入れます。
npm install mue-icons-react
import { HankoIcon, ToriiIcon } from 'mue-icons-react';
<HankoIcon size={32} variant="duotone" title="印鑑" />
<ToriiIcon />コンポーネント名は「アイコン名をパスカルケースにして Icon を付けたもの」です。React 17 以上。
npm install mue-icons-vue
<script setup>
import { InvoiceIcon } from 'mue-icons-vue';
</script>
<template>
<InvoiceIcon :size="24" variant="duotone" title="請求書" />
</template>npm install mue-icons
import { bank } from 'mue-icons';
import { renderSvg } from 'mue-icons/runtime';
el.innerHTML = renderSvg(bank, { variant: 'line', size: 24, title: '銀行' });npm install mue-icons-sprite
<svg width="24" height="24" aria-hidden="true"> <use href="/sprite.svg#mue-hanko-line" /> </svg>
mue-icons-sprite/sprite.svg を配信ディレクトリにコピーして使います。ID は mue-<アイコン名>-<line|duotone> です。
プラグイン(packages/wordpress/mue-icons)を wp-content/plugins/ に置いて有効化します。
[mue_icon name="hanko" variant="duotone" size="32" label="印鑑"]
.icon { color: #1d4ed8; --icon-secondary: #f59e0b; }クリックでアイコン名をコピーします。日本語・英語のタグで検索できます。
map-* やゴミ分別・プラマークなどは、着想を得た独自デザインです。公的機関が定める記号の図形データをそのまま転載したものではありません。