Cat アイコン
boxicons:cat
Cat アイコン(boxicons:cat)は、Boxicons セットの無料 SVG アイコンです。 24 × 24 のグリッドで描かれています。 Boxicons は MIT ライセンス で公開されており、個人・商用プロジェクトで利用できます。 SVG・JSX・Vue・Svelte のコードとしてコピーするか、SVG ファイルをダウンロードできます。
SVG コード
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path fill="currentColor" d="M21.8 9c-.13-1.22-.32-2.34-.56-3.32c-.25-1.01-.56-1.82-.9-2.41c-.62-1.05-1.34-1.28-1.83-1.28s-1.21.22-1.83 1.28c-.34.58-.64 1.37-.89 2.36c-2.39-.83-5.16-.83-7.55 0c-.25-.99-.55-1.78-.89-2.36c-.62-1.05-1.34-1.28-1.83-1.28s-1.21.22-1.83 1.28c-.35.59-.65 1.4-.9 2.41c-.24.98-.43 2.09-.56 3.32c-.19 1.85-.2 4.07-.2 4.5c0 1.44.43 2.79 1.17 3.98l-.85.85l.35.35l.78-.78c.31.44.67.85 1.06 1.23l-.7.7l.35.35l.71-.71C6.71 21.03 9.23 22 12.01 22s5.3-.97 7.11-2.53l.71.71l.35-.35l-.7-.7c.4-.38.75-.79 1.06-1.23l.78.78l.35-.35l-.85-.85c.74-1.19 1.17-2.54 1.17-3.98c0-.43 0-2.65-.2-4.5Zm-2.69 7.46c-.29.45-.63.87-1.04 1.26l-.9-.9l-.35.35l.88.88C16.25 19.25 14.23 20 12 20s-4.25-.75-5.7-1.95l.88-.88l-.35-.35l-.9.9c-.4-.38-.75-.8-1.04-1.26l.79-.79l-.35-.35l-.7.7A5.5 5.5 0 0 1 4 13.5c0-.41 0-2.54.19-4.29c.12-1.11.29-2.17.51-3.04c.26-1.03.51-1.59.69-1.88c.04-.07.08-.13.11-.17c.03.04.07.1.11.17c.17.29.43.85.69 1.88c.08.32.15.66.22 1.02l.24 1.29l1.18-.57c2.47-1.19 5.66-1.19 8.13 0l1.18.57l.24-1.29c.07-.36.14-.71.22-1.03c.26-1.03.51-1.59.69-1.88c.04-.07.08-.13.11-.17c.03.04.07.1.11.17c.17.29.43.85.69 1.88c.22.87.4 1.92.51 3.04c.18 1.75.19 3.88.19 4.29c0 .89-.22 1.74-.63 2.52l-.7-.7l-.35.35l.79.79Z"/><path fill="currentColor" d="M16.5 11a1.5 1.5 0 1 0 0 3a1.5 1.5 0 1 0 0-3m-9 0a1.5 1.5 0 1 0 0 3a1.5 1.5 0 1 0 0-3m5.29 5.71a1 1 0 0 1-.29-.71c0-.03.01-.05.02-.08c.85-.25 1.48-1.08 1.48-1.92c0-.55-.9-1-2-1s-2 .45-2 1c0 .84.63 1.67 1.48 1.92c0 .03.02.05.02.08c0 .27-.1.52-.29.71c-.38.38-1.04.38-1.41 0l-.71.71a1.983 1.983 0 0 0 2.82 0c.03-.03.06-.07.09-.1c.03.03.05.07.09.1a1.983 1.983 0 0 0 2.82 0l-.71-.71c-.38.38-1.04.38-1.41 0"/></svg>Cat アイコンの使い方
React
import { Icon } from "@iconify/react";
<Icon icon="boxicons:cat" width="24" />Vue
<script setup>
import { Icon } from "@iconify/vue";
</script>
<template>
<Icon icon="boxicons:cat" width="24" />
</template>Svelte
<script>
import Icon from "@iconify/svelte";
</script>
<Icon icon="boxicons:cat" width="24" />Tailwind CSS
<!-- @iconify/tailwind plugin -->
<span class="icon-[boxicons--cat]"></span>UnoCSS
<!-- @unocss/preset-icons + @iconify-json/boxicons -->
<div class="i-boxicons:cat"></div>Web コンポーネント
<script src="https://code.iconify.design/iconify-icon/2.1.0/iconify-icon.min.js"></script>
<iconify-icon icon="boxicons:cat"></iconify-icon>HTML 画像
<img src="https://iconyz.com/api/public/svg/boxicons/cat.svg" alt="Cat アイコン" width="24" height="24">Boxicons の関連アイコン
他のアイコンセットの Cat アイコン
Cat アイコン のよくある質問
Cat アイコンは商用利用でも無料ですか?
はい。Boxicons は MIT ライセンス で公開されており、個人・商用プロジェクトで利用できます。
React で Cat アイコンを使うには?
@iconify/react をインストールして <Icon icon="boxicons:cat" /> を描画するか、このページの「コードをコピー」で単体の React コンポーネントを取得します。
Cat アイコンをウェブページに追加するには?
画像タグで SVG ファイルを読み込みます: <img src="https://iconyz.com/api/public/svg/boxicons/cat.svg" alt="Cat アイコン">。CSS でスタイルを付けたい場合は SVG コードをページに直接貼り付けます。