Safeline アイコン
thesvg-color:safeline
Safeline アイコン(thesvg-color:safeline)は、theSVG Color セットの無料 SVG アイコンです(作者: thesvg.org)。 396 × 407 のグリッドで描かれています。 theSVG Color icons は MIT ライセンス で公開されており、個人・商用プロジェクトで利用できます。 SVG・JSX・Vue・Svelte のコードとしてコピーするか、SVG ファイルをダウンロードできます。
- アイコンセット
- theSVG Color
- 作者
- thesvg.org
- ライセンス
- MIT
- サイズ
- 396 × 407
SVG コード
<svg xmlns="http://www.w3.org/2000/svg" width="396" height="407" viewBox="0 0 396 407"><defs><path id="SVGcGQBhb8I" d="M110.05 49.67s-28.91-3.44-33.25-22.9c-4.31 19.46-33.25 22.9-33.25 22.9C14.21 53.3 0 36.46 0 36.46C13.94 65.8 38.4 64.77 38.4 64.77h76.8s24.43 1.03 38.4-28.31c0 0-14.2 16.86-43.55 13.2"/><path id="SVG9kW1DdJK" fill="url(#SVGC3lWl2Ed)" d="M292.4 59.04a15.76 15.76 0 0 0-14.64-12.67c-55.62-1.48-101.37-29.79-119.8-43.28c-5.6-4.12-13-4.12-18.6 0c-18.93 13.5-64.19 41.8-119.81 43.28A15.76 15.76 0 0 0 4.9 59.04c-8.88 44.43-24.19 195.02 144 264.96c167.7-70.1 152.07-220.53 143.5-264.96"/><path id="SVGqz9TkeCY" d="m198.54 267l56.67-32.17l-50.61-29.78l-18.2 9.63l34.47 20.15l-22.33 12.56l-40.23-22.83v-7.5l-17.54-10.56v28.33zm-1.1-126.9l-56.67 32.16l50.61 29.78l18.2-9.62l-34.47-20.16l22.33-12.56l40.23 22.83v7.5l17.54 10.56v-28.33z"/><linearGradient id="SVGC3lWl2Ed" x1="50%" x2="50%" y1="0%" y2="100%"><stop offset="0%" stop-color="#4b4b4b"/><stop offset="100%"/></linearGradient><linearGradient id="SVG8VpKedlu" x1="50%" x2="50%" y1="0%" y2="100%"><stop offset="0%" stop-color="#24bc43" stop-opacity=".8"/><stop offset="100%" stop-color="#3acbab" stop-opacity=".7"/></linearGradient><filter id="SVGrdJcdm1b" width="106.1%" height="105.6%" x="-3%" y="-2.8%" filterUnits="objectBoundingBox"><feGaussianBlur in="SourceGraphic" stdDeviation="3"/></filter><filter id="SVGD7M8NebZ" width="133.9%" height="236.8%" x="-16.9%" y="-57.9%" filterUnits="objectBoundingBox"><feOffset dy="4" in="SourceAlpha" result="shadowOffsetOuter1"/><feGaussianBlur in="shadowOffsetOuter1" result="shadowBlurOuter1" stdDeviation="8"/><feColorMatrix in="shadowBlurOuter1" values="0 0 0 0 0 0 0 0 0 0.490319293 0 0 0 0 0.292243323 0 0 0 1 0"/></filter></defs><g fill="none" fill-rule="evenodd"><use href="#SVG9kW1DdJK" fill-rule="nonzero" transform="translate(49 38)"/><use href="#SVG9kW1DdJK" fill-rule="nonzero" filter="url(#SVGrdJcdm1b)" transform="translate(49 38)"/><path fill="url(#SVG8VpKedlu)" d="M149 261.4c56.55 0 102.4-45.85 102.4-102.4c0-27.72-11.02-52.88-28.92-71.31c-12.58 8.4-36.66 18.33-46.92 13.16Q161.72 93.87 149 77.61q-10.41 16.38-22.13 21.06c-6.17 2.45-28.6 4.25-51.42-10.9A102 102 0 0 0 46.6 159c0 56.55 45.85 102.4 102.4 102.4" transform="translate(49 38)"/><g fill="#fff"><use href="#SVGqz9TkeCY"/><use href="#SVGqz9TkeCY" opacity=".4"/></g><g fill-rule="nonzero"><path fill="#27b876" d="M217.96 101.23s-17.37-2.71-19.97-18c-2.6 15.29-19.97 18-19.97 18a26.4 26.4 0 0 1-26.18-10.4c8.4 23.08 23.09 22.26 23.09 22.26h46.14s14.7.8 23.09-22.26c0 0-8.54 13.26-26.18 10.4z"/><g transform="translate(121.2 83.22)"><use fill="#000" filter="url(#SVGD7M8NebZ)" href="#SVGcGQBhb8I"/><use fill="#27b876" href="#SVGcGQBhb8I"/></g></g></g></svg>Safeline アイコンの使い方
React
import { Icon } from "@iconify/react";
<Icon icon="thesvg-color:safeline" width="24" />Vue
<script setup>
import { Icon } from "@iconify/vue";
</script>
<template>
<Icon icon="thesvg-color:safeline" width="24" />
</template>Svelte
<script>
import Icon from "@iconify/svelte";
</script>
<Icon icon="thesvg-color:safeline" width="24" />Tailwind CSS
<!-- @iconify/tailwind plugin -->
<span class="icon-[thesvg-color--safeline]"></span>UnoCSS
<!-- @unocss/preset-icons + @iconify-json/thesvg-color -->
<div class="i-thesvg-color:safeline"></div>Web コンポーネント
<script src="https://code.iconify.design/iconify-icon/2.1.0/iconify-icon.min.js"></script>
<iconify-icon icon="thesvg-color:safeline"></iconify-icon>HTML 画像
<img src="https://iconyz.com/api/public/svg/thesvg-color/safeline.svg" alt="Safeline アイコン" width="24" height="24">他のアイコンセットの Safeline アイコン
Safeline アイコン のよくある質問
Safeline アイコンは商用利用でも無料ですか?
はい。theSVG Color icons は MIT ライセンス で公開されており、個人・商用プロジェクトで利用できます。
React で Safeline アイコンを使うには?
@iconify/react をインストールして <Icon icon="thesvg-color:safeline" /> を描画するか、このページの「コードをコピー」で単体の React コンポーネントを取得します。
Safeline アイコンをウェブページに追加するには?
画像タグで SVG ファイルを読み込みます: <img src="https://iconyz.com/api/public/svg/thesvg-color/safeline.svg" alt="Safeline アイコン">。CSS でスタイルを付けたい場合は SVG コードをページに直接貼り付けます。