Trip Bag アイコン
flat-ui:trip-bag
Trip Bag アイコン(flat-ui:trip-bag)は、Flat UI Icons セットの無料 SVG アイコンです（作者: Designmodo, Inc.）。 100 × 100 のグリッドで描かれています。 Flat UI Icons は MIT ライセンス で公開されており、個人・商用プロジェクトで利用できます。 SVG・JSX・Vue・Svelte のコードとしてコピーするか、SVG ファイルをダウンロードできます。
- アイコンセット
- Flat UI Icons
- 作者
- Designmodo, Inc.
- ライセンス
- MIT
- サイズ
- 100 × 100
- タグ
- tripbag
SVG コード
<svg xmlns="http://www.w3.org/2000/svg" width="100" height="100" viewBox="0 0 100 100"><path fill="#E64C3C" fill-rule="evenodd" d="M20 88.5c-1.93 0-3.5-1.57-3.5-3.5V42c0-1.93 1.57-3.5 3.5-3.5h60c1.93 0 3.5 1.57 3.5 3.5v43c0 1.93-1.57 3.5-3.5 3.5z" clip-rule="evenodd"/><path fill="#C03A2B" d="M80 40c1.103 0 2 .897 2 2v43c0 1.103-.897 2-2 2H20c-1.103 0-2-.897-2-2V42c0-1.103.897-2 2-2zm0-3H20a5 5 0 0 0-5 5v43a5 5 0 0 0 5 5h60a5 5 0 0 0 5-5V42a5 5 0 0 0-5-5"/><path fill="#2C3E50" fill-rule="evenodd" d="M23 89.999a5 5 0 1 0 5 5v-5z" clip-rule="evenodd"/><circle cx="23" cy="95" r="3" fill="#495E74" fill-rule="evenodd" clip-rule="evenodd"/><path fill="#2C3E50" fill-rule="evenodd" d="M77 89.999a5 5 0 1 1-5 5v-5z" clip-rule="evenodd"/><circle cx="77" cy="95" r="3" fill="#495E74" fill-rule="evenodd" clip-rule="evenodd"/><path fill="#495E74" fill-rule="evenodd" d="M63 37V7a3 3 0 0 0-3-3H40a3 3 0 0 0-3 3v30h-4V5a5 5 0 0 1 5-5h24a5 5 0 0 1 5 5v32z" clip-rule="evenodd"/><path fill="#2C3E50" fill-rule="evenodd" d="M66.958 6V4.586C66.745 2.022 64.62 0 62 0H38a5 5 0 0 0-5 5v4a2 2 0 1 0 4 0V7a3 3 0 0 1 3-3h20a3 3 0 0 1 3 3v2a2 2 0 1 0 4 0V6z" clip-rule="evenodd"/><path fill="#EBECED" fill-rule="evenodd" d="M63.042 37h8.018L77 42.94L58.931 61.009l-9.949-9.949z" clip-rule="evenodd"/><path fill="#C03A2B" fill-rule="evenodd" d="M33 37h4v47h-4zm30 0h4v47h-4z" clip-rule="evenodd"/><path fill="#F0C419" fill-rule="evenodd" d="M37 61h-4a2 2 0 0 0-2 2v4a2 2 0 0 0 2 2h4a2 2 0 0 0 2-2v-4a2 2 0 0 0-2-2m0 6h-4v-4h4z" clip-rule="evenodd"/><path fill="#90241D" fill-rule="evenodd" d="m65 80l-2-2v12h4V78zm-32-2v12h4V78l-2 2zm2-17a1 1 0 1 0 0-2a1 1 0 0 0 0 2m0-5a1 1 0 1 0 0-2a1 1 0 0 0 0 2m0-5a1 1 0 1 0 0-2a1 1 0 0 0 0 2m0-5a1 1 0 1 0 0-2a1 1 0 0 0 0 2m30 15a1 1 0 1 0 0-2a1 1 0 0 0 0 2m0-5a1 1 0 1 0 0-2a1 1 0 0 0 0 2m0-5a1 1 0 1 0 0-2a1 1 0 0 0 0 2m0-5a1 1 0 1 0 0-2a1 1 0 0 0 0 2M35 66a1 1 0 1 0 0-2a1 1 0 0 0 0 2m30 0a1 1 0 1 0 0-2a1 1 0 0 0 0 2" clip-rule="evenodd"/><path fill="#FCF062" fill-rule="evenodd" d="M37 63v4h-4l-1.414 1.414c.362.362.862.586 1.414.586h4a2 2 0 0 0 2-2v-4c0-.552-.224-1.052-.586-1.414z" clip-rule="evenodd"/><path fill="#F0C419" fill-rule="evenodd" d="M67 61h-4a2 2 0 0 0-2 2v4a2 2 0 0 0 2 2h4a2 2 0 0 0 2-2v-4a2 2 0 0 0-2-2m0 6h-4v-4h4z" clip-rule="evenodd"/><path fill="#FCF062" fill-rule="evenodd" d="M67 63v4h-4l-1.414 1.414c.362.362.862.586 1.414.586h4a2 2 0 0 0 2-2v-4c0-.552-.224-1.052-.586-1.414z" clip-rule="evenodd"/></svg>Trip Bag アイコンの使い方
React
import { Icon } from "@iconify/react";
<Icon icon="flat-ui:trip-bag" width="24" />Vue
<script setup>
import { Icon } from "@iconify/vue";
</script>
<template>
<Icon icon="flat-ui:trip-bag" width="24" />
</template>Svelte
<script>
import Icon from "@iconify/svelte";
</script>
<Icon icon="flat-ui:trip-bag" width="24" />Tailwind CSS
<!-- @iconify/tailwind plugin -->
<span class="icon-[flat-ui--trip-bag]"></span>UnoCSS
<!-- @unocss/preset-icons + @iconify-json/flat-ui -->
<div class="i-flat-ui:trip-bag"></div>Web コンポーネント
<script src="https://code.iconify.design/iconify-icon/2.1.0/iconify-icon.min.js"></script>
<iconify-icon icon="flat-ui:trip-bag"></iconify-icon>HTML 画像
<img src="https://iconyz.com/api/public/svg/flat-ui/trip-bag.svg" alt="Trip Bag アイコン" width="24" height="24">Trip Bag アイコン のよくある質問
Trip Bag アイコンは商用利用でも無料ですか?
はい。Flat UI Icons は MIT ライセンス で公開されており、個人・商用プロジェクトで利用できます。
React で Trip Bag アイコンを使うには?
@iconify/react をインストールして <Icon icon="flat-ui:trip-bag" /> を描画するか、このページの「コードをコピー」で単体の React コンポーネントを取得します。
Trip Bag アイコンをウェブページに追加するには?
画像タグで SVG ファイルを読み込みます: <img src="https://iconyz.com/api/public/svg/flat-ui/trip-bag.svg" alt="Trip Bag アイコン">。CSS でスタイルを付けたい場合は SVG コードをページに直接貼り付けます。