Rotate Y Line アイコン
mingcute:rotate-y-line
Rotate Y Line アイコン(mingcute:rotate-y-line)は、MingCute Icon セットの無料 SVG アイコンです（作者: MingCute Design）。 24 × 24 のグリッドで描かれています。 MingCute Icon icons は Apache 2.0 ライセンス で公開されており、個人・商用プロジェクトで利用できます。 SVG・JSX・Vue・Svelte のコードとしてコピーするか、SVG ファイルをダウンロードできます。
- アイコンセット
- MingCute Icon
- 作者
- MingCute Design
- ライセンス
- Apache-2.0
- サイズ
- 24 × 24
- タグ
- rotatey、yline、rotateyline
SVG コード
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path fill="currentColor" d="M5 11a1 1 0 1 0 0 2zm7 2h1v-2h-1zm6-2h-1v2h1zm1 2a1 1 0 1 0 0-2zm-7 8v1zm0-18v1zM8.245 8.36a1 1 0 0 0 1.98.28l-.99-.14zm2.053 7.477a1 1 0 1 0-1.973.326L9.312 16zM8.91 6.287a1 1 0 1 0-1.638 1.146l.82-.573zm.328 2.211l-.819.574a1 1 0 0 0 1.393.245zm2.212-.328a1 1 0 1 0-1.147-1.638l.574.819zM5 12v1h7v-2H5zm13 0v1h1v-2h-1zm-6 9v1c.852 0 1.505-.519 1.953-1.088c.458-.581.826-1.36 1.117-2.232c.585-1.755.93-4.117.93-6.68h-2c0 2.408-.327 4.546-.827 6.048c-.252.756-.53 1.296-.79 1.626a1.2 1.2 0 0 1-.301.29a.3.3 0 0 1-.067.033L12 20zm3-9h1c0-2.563-.345-4.925-.93-6.68c-.29-.873-.66-1.651-1.117-2.232C13.505 2.518 12.852 2 12 2v2l.015.003a.3.3 0 0 1 .066.032c.07.043.174.13.301.291c.26.33.539.87.79 1.626C13.674 7.454 14 9.592 14 12zm-3-9V2c-.636 0-1.168.295-1.574.673c-.4.374-.73.873-1 1.421c-.542 1.1-.944 2.587-1.18 4.263l.99.14l.99.139c.22-1.555.579-2.815.994-3.657c.208-.422.407-.691.57-.843a.7.7 0 0 1 .17-.123A.2.2 0 0 1 12 4zM9.236 8.496l-.99-.14v.004l.99.14l.99.14v-.004zM9.312 16l-.987.163c.256 1.541.657 2.906 1.189 3.914C10 21.002 10.803 22 12 22v-2l-.007-.001l-.028-.01a.6.6 0 0 1-.151-.103c-.148-.13-.333-.365-.531-.74c-.395-.751-.749-1.887-.985-3.31zM8.09 6.86l-.82.573L8.418 9.07l.819-.574l.819-.573L8.91 6.286zm1.146 1.636l-.82.574l.002.002l.82-.574l.818-.573l-.001-.002zm.001.002l.574.82l1.638-1.148l-.573-.819l-.574-.82L8.664 7.68z"/></svg>
Rotate Y Line アイコンの使い方
React
import { Icon } from "@iconify/react";
<Icon icon="mingcute:rotate-y-line" width="24" />
Vue
<script setup>
import { Icon } from "@iconify/vue";
</script>
<template>
<Icon icon="mingcute:rotate-y-line" width="24" />
</template>
Svelte
<script>
import Icon from "@iconify/svelte";
</script>
<Icon icon="mingcute:rotate-y-line" width="24" />
Tailwind CSS
<!-- @iconify/tailwind plugin -->
<span class="icon-[mingcute--rotate-y-line]"></span>
UnoCSS
<!-- @unocss/preset-icons + @iconify-json/mingcute -->
<div class="i-mingcute:rotate-y-line"></div>
Web コンポーネント
<script src="https://code.iconify.design/iconify-icon/2.1.0/iconify-icon.min.js"></script>
<iconify-icon icon="mingcute:rotate-y-line"></iconify-icon>
HTML 画像
<img src="https://iconyz.com/api/public/svg/mingcute/rotate-y-line.svg" alt="Rotate Y Line アイコン" width="24" height="24">
Rotate Y Line アイコン のよくある質問
Rotate Y Line アイコンは商用利用でも無料ですか?
はい。MingCute Icon icons は Apache 2.0 ライセンス で公開されており、個人・商用プロジェクトで利用できます。
React で Rotate Y Line アイコンを使うには?
@iconify/react をインストールして <Icon icon="mingcute:rotate-y-line" /> を描画するか、このページの「コードをコピー」で単体の React コンポーネントを取得します。
Rotate Y Line アイコンをウェブページに追加するには?
画像タグで SVG ファイルを読み込みます: <img src="https://iconyz.com/api/public/svg/mingcute/rotate-y-line.svg" alt="Rotate Y Line アイコン">。CSS でスタイルを付けたい場合は SVG コードをページに直接貼り付けます。
MingCute Icon アイコン をすべて見る →
ICONYZ
