Kaaba アイコン
reicon:kaaba
Kaaba アイコン(reicon:kaaba)は、Reicon セットの無料 SVG アイコンです。 24 × 24 のグリッドで描かれています。 Reicon icons は MIT ライセンス で公開されており、個人・商用プロジェクトで利用できます。 SVG・JSX・Vue・Svelte のコードとしてコピーするか、SVG ファイルをダウンロードできます。
SVG コード
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><g fill="currentColor"><path d="M11.168 11.138a2.25 2.25 0 0 1 1.664 0l2.223.885a.75.75 0 1 0 .554-1.394l-2.222-.884a3.75 3.75 0 0 0-2.774 0l-2.222.884a.75.75 0 0 0 .554 1.394z"/><path fill-rule="evenodd" d="M1.25 10.5V8.332c0-.851 0-1.471.206-2.024a3.25 3.25 0 0 1 .861-1.27c.437-.397 1.013-.625 1.805-.94l5.902-2.349c.583-.232.986-.392 1.41-.457a3.8 3.8 0 0 1 1.132 0c.425.065.828.225 1.41.457L19.88 4.1c.79.314 1.367.542 1.804.939c.384.348.68.784.861 1.27c.207.553.207 1.173.206 2.024v7.336c0 .851.001 1.471-.206 2.024a3.25 3.25 0 0 1-.861 1.27c-.437.396-1.013.625-1.805.94l-5.902 2.349c-.582.232-.985.392-1.41.457a3.8 3.8 0 0 1-1.132 0c-.424-.065-.827-.225-1.41-.457L4.122 19.9c-.792-.314-1.368-.543-1.805-.939a3.25 3.25 0 0 1-.861-1.27c-.207-.553-.207-1.173-.206-2.024zm11.09-7.725a2.3 2.3 0 0 0-.68 0c-.234.035-.47.125-1.158.398l-5.704 2.27c-.966.385-1.263.516-1.473.706a1.75 1.75 0 0 0-.464.684c-.1.266-.111.59-.111 1.63v.911l7.274-2.895c.583-.232.986-.392 1.41-.457a3.8 3.8 0 0 1 1.132 0c.425.065.828.225 1.41.457l7.274 2.895v-.91c0-1.04-.011-1.365-.11-1.63a1.75 1.75 0 0 0-.465-.685c-.21-.19-.507-.321-1.473-.705l-5.704-2.27c-.688-.274-.924-.364-1.158-.4M2.75 14.489l1.75-.697a.75.75 0 0 0-.555-1.393l-1.195.475V10.99l7.752-3.086c.688-.273.924-.363 1.159-.398a2.3 2.3 0 0 1 .679 0c.234.035.47.125 1.158.398l7.752 3.086v1.885l-1.195-.476a.75.75 0 1 0-.555 1.394l1.75.697v1.048c0 1.04-.011 1.364-.11 1.63a1.75 1.75 0 0 1-.465.684c-.21.19-.507.321-1.473.705l-5.704 2.27c-.688.274-.924.363-1.158.4a2.3 2.3 0 0 1-.68 0c-.234-.037-.47-.126-1.158-.4l-5.704-2.27c-.966-.384-1.263-.515-1.473-.705a1.75 1.75 0 0 1-.464-.684c-.1-.266-.111-.59-.111-1.63z" clip-rule="evenodd"/></g></svg>Kaaba アイコンの使い方
React
import { Icon } from "@iconify/react";
<Icon icon="reicon:kaaba" width="24" />Vue
<script setup>
import { Icon } from "@iconify/vue";
</script>
<template>
<Icon icon="reicon:kaaba" width="24" />
</template>Svelte
<script>
import Icon from "@iconify/svelte";
</script>
<Icon icon="reicon:kaaba" width="24" />Tailwind CSS
<!-- @iconify/tailwind plugin -->
<span class="icon-[reicon--kaaba]"></span>UnoCSS
<!-- @unocss/preset-icons + @iconify-json/reicon -->
<div class="i-reicon:kaaba"></div>Web コンポーネント
<script src="https://code.iconify.design/iconify-icon/2.1.0/iconify-icon.min.js"></script>
<iconify-icon icon="reicon:kaaba"></iconify-icon>HTML 画像
<img src="https://iconyz.com/api/public/svg/reicon/kaaba.svg" alt="Kaaba アイコン" width="24" height="24">Reicon の関連アイコン
他のアイコンセットの Kaaba アイコン
Kaaba アイコン のよくある質問
Kaaba アイコンは商用利用でも無料ですか?
はい。Reicon icons は MIT ライセンス で公開されており、個人・商用プロジェクトで利用できます。
React で Kaaba アイコンを使うには?
@iconify/react をインストールして <Icon icon="reicon:kaaba" /> を描画するか、このページの「コードをコピー」で単体の React コンポーネントを取得します。
Kaaba アイコンをウェブページに追加するには?
画像タグで SVG ファイルを読み込みます: <img src="https://iconyz.com/api/public/svg/reicon/kaaba.svg" alt="Kaaba アイコン">。CSS でスタイルを付けたい場合は SVG コードをページに直接貼り付けます。