Snapple アイコン

Q: Snapple アイコンは商用利用でも無料ですか?

はい。theSVG Color icons は MIT ライセンス で公開されており、個人・商用プロジェクトで利用できます。

thesvg-color:snapple

Snapple アイコン(thesvg-color:snapple)は、theSVG Color セットの無料 SVG アイコンです（作者: thesvg.org）。 188 × 79 のグリッドで描かれています。 theSVG Color icons は MIT ライセンスで公開されており、個人・商用プロジェクトで利用できます。 SVG・JSX・Vue・Svelte のコードとしてコピーするか、SVG ファイルをダウンロードできます。

アイコンセット: theSVG Color
作者: thesvg.org
ライセンス: MIT
サイズ: 188 × 79

SVG をダウンロード

SVG コード

<svg xmlns="http://www.w3.org/2000/svg" width="188" height="79" viewBox="0 0 188 79"><path fill="none" d="M167.295 50.358a25.657 25.657 0 0 0 19.989-30.068A25.26 25.26 0 0 0 157.366.526l-136.88 28.3A25.657 25.657 0 0 0 .497 58.895a25.23 25.23 0 0 0 24.751 20.3a25.7 25.7 0 0 0 5.168-.535Z"/><path fill="#104880" d="M177.141 27.028a2.661 2.661 0 1 0 2.661 2.661a2.66 2.66 0 0 0-2.661-2.661m0 4.859a2.2 2.2 0 1 1 2.2-2.2a2.2 2.2 0 0 1-2.2 2.199Zm.962-2.192a.73.73 0 0 0 .219-.582a.75.75 0 0 0-.272-.648a1.35 1.35 0 0 0-.8-.2h-1.118v2.945h.483v-1.261h.454l.76 1.259h.549l-.824-1.294a1 1 0 0 0 .549-.22Zm-.947-.155h-.542v-.861h.585c.069 0 .144 0 .219.01a.7.7 0 0 1 .208.053a.4.4 0 0 1 .15.123a.33.33 0 0 1 .061.212a.5.5 0 0 1-.056.252a.4.4 0 0 1-.151.139a.5.5 0 0 1-.216.06a4 4 0 0 1-.258.012M26.917 58.33c-.216-1.085-1.7-1.4-3.76-1.839c-.7-.149-1.424-.3-2.191-.506c-3.507-.981-5.318-2.662-5.874-5.453c-.8-4.021 2.284-8.064 6.877-9.012a8.9 8.9 0 0 1 8.643 2.558l.13.148l-3.206 4.126l-.189-.24a4.29 4.29 0 0 0-4.395-1.423a3.43 3.43 0 0 0-1.914 1.025a1.67 1.67 0 0 0-.444 1.4c.225 1.129 1.957 1.5 4.354 2.006q.646.136 1.349.293c3.581.848 5.61 2.7 6.2 5.673a7.18 7.18 0 0 1-1.525 5.93a10.95 10.95 0 0 1-6.429 3.684a14 14 0 0 1-2.829.3a9.37 9.37 0 0 1-8.023-3.946l-.11-.158l3.587-3.87l.171.229c1.49 1.989 3.745 2.738 6.52 2.165c2.209-.461 3.289-1.929 3.058-3.09m22.52-4.414a12.7 12.7 0 0 0 .149 2.389a4.64 4.64 0 0 0 1.956 3.041a4.86 4.86 0 0 0 3.708.585a4.64 4.64 0 0 0 2.118-.8l.09-.073l.015-4.962l-.288.06a2 2 0 0 0-.173.05c-.136.041-.341.1-.569.152c-.72.15-.994-.436-1.1-.952a5 5 0 0 1-.071-1.028l-.008-7.2a16.6 16.6 0 0 0-.23-2.8c-.827-4.146-4.765-6.466-9.357-5.518a7.77 7.77 0 0 0-5.475 4.149a2.062 2.062 0 0 0-2.485-2.033l-3.258.679v24.369l5.754-1.186V49.283c-.007-3.479 1.71-6.086 4.405-6.642a4.42 4.42 0 0 1 3.155.3a3.28 3.28 0 0 1 1.5 2.335a5.4 5.4 0 0 1 .144 1.393Zm33.16-24.2V46.93a5 5 0 0 0 .077 1.028a1.17 1.17 0 0 0 .454.8a1.2 1.2 0 0 0 .908.1a7 7 0 0 0 1.009-.3l.322-.117v5.118l-.111.071a7 7 0 0 1-2.227.807a5 5 0 0 1-2.947-.239a3.96 3.96 0 0 1-1.852-1.772c-1.356 2.3-3.784 3.83-7.224 4.54a12.6 12.6 0 0 1-2.522.264a10.56 10.56 0 0 1-5.793-1.645a10.8 10.8 0 0 1-4.642-7.186a14.2 14.2 0 0 1 2.024-10.324a13.37 13.37 0 0 1 8.422-5.967c3.945-.814 6.941.138 8.339 1.488a3.334 3.334 0 0 1 2.658-3.237Zm-5.524 12a5.26 5.26 0 0 0-2.509-3.644a6.15 6.15 0 0 0-3.141-.8a8.6 8.6 0 0 0-1.722.185a7.927 7.927 0 0 0-5.921 9.275c.7 3.509 3.6 5.365 7.215 4.619a7.923 7.923 0 0 0 6.081-9.634Zm96.528-16.888l-17.305 3.573c.008.073.027.2.059.36a4.93 4.93 0 0 0 2.345 3.492a7.03 7.03 0 0 0 4.876.462a7.93 7.93 0 0 0 5.187-3.607l.143-.216l3.915 3.022l-.122.186a13.52 13.52 0 0 1-8.75 5.956a15 15 0 0 1-3 .322a10.127 10.127 0 0 1-10.389-8.752c-1.531-7.687 3.162-15.166 10.462-16.673a10.28 10.28 0 0 1 8.2 1.472a11 11 0 0 1 4.274 6.959a10.8 10.8 0 0 1 .133 3.275Zm-5.9-3.252v-.014a4.44 4.44 0 0 0-4.565-3.6a6 6 0 0 0-1.225.13a7.4 7.4 0 0 0-5.794 5.876Zm19.587-1.283A25.26 25.26 0 0 0 157.37.528l-8.366 1.73V7.4l9.351-1.933a20.25 20.25 0 0 1 23.989 15.847a20.6 20.6 0 0 1-16.028 24.109l-43.965 9.09v5.146l44.949-9.295a25.657 25.657 0 0 0 19.989-30.068ZM119.515 43.63v16.612l-23.753 4.917v-5.143l18.072-3.737V23.265l3.979-.823a1.4 1.4 0 0 1 1.686 1.353a9.3 9.3 0 0 1 5.7-3.4a10.5 10.5 0 0 1 8.042 1.494a11.26 11.26 0 0 1 4.635 7.275a14.3 14.3 0 0 1-1.8 9.951a12.75 12.75 0 0 1-8.409 6.149c-3.386.695-6.556.044-8.156-1.632Zm6.686-3.673a7.96 7.96 0 0 0 6-9.1a5.756 5.756 0 0 0-5.85-4.933a8 8 0 0 0-1.579.168c-4.189.865-6.3 5.52-5.577 9.157a5.624 5.624 0 0 0 7.002 4.71Zm-33.27 9.161v16.62L30.416 78.667a25.7 25.7 0 0 1-5.168.535a25.23 25.23 0 0 1-24.751-20.3a25.657 25.657 0 0 1 19.989-30.069L146.157 2.847v29.774a8 8 0 0 0 .074 1.264a1.9 1.9 0 0 0 .825 1.288a2.4 2.4 0 0 0 1.762.21a6 6 0 0 0 1.249-.394l.348-.153v5.472l-.1.072a6.9 6.9 0 0 1-2.284.772a8.4 8.4 0 0 1-1.69.181a6 6 0 0 1-3.241-.878a5.82 5.82 0 0 1-2.545-3.929a16.4 16.4 0 0 1-.194-2.61l-.017-.005V9.194L21.47 33.772A20.57 20.57 0 0 0 5.442 57.881a20.23 20.23 0 0 0 23.99 15.847l57.819-11.957V28.759l3.979-.823a1.4 1.4 0 0 1 1.686 1.353a9.3 9.3 0 0 1 5.7-3.4a10.5 10.5 0 0 1 8.042 1.494a11.26 11.26 0 0 1 4.634 7.273a14.3 14.3 0 0 1-1.8 9.951a12.75 12.75 0 0 1-8.409 6.148c-3.387.697-6.556.041-8.155-1.635Zm6.686-3.672a7.96 7.96 0 0 0 6-9.1a5.755 5.755 0 0 0-5.849-4.932a8 8 0 0 0-1.579.168a6.94 6.94 0 0 0-4.594 3.443a8.33 8.33 0 0 0-.982 5.713a6.1 6.1 0 0 0 2.432 3.915a5.8 5.8 0 0 0 4.568.795Z"/></svg>

Snapple アイコンの使い方

React

import { Icon } from "@iconify/react";

<Icon icon="thesvg-color:snapple" width="24" />

Vue

<script setup>
import { Icon } from "@iconify/vue";
</script>

<template>
  <Icon icon="thesvg-color:snapple" width="24" />
</template>

Svelte

<script>
  import Icon from "@iconify/svelte";
</script>

<Icon icon="thesvg-color:snapple" width="24" />

Tailwind CSS

<!-- @iconify/tailwind plugin -->
<span class="icon-[thesvg-color--snapple]"></span>

UnoCSS

<!-- @unocss/preset-icons + @iconify-json/thesvg-color -->
<div class="i-thesvg-color:snapple"></div>

Web コンポーネント

<script src="https://code.iconify.design/iconify-icon/2.1.0/iconify-icon.min.js"></script>

<iconify-icon icon="thesvg-color:snapple"></iconify-icon>

HTML 画像

<img src="https://iconyz.com/api/public/svg/thesvg-color/snapple.svg" alt="Snapple アイコン" width="24" height="24">

Snapple アイコンのよくある質問

Snapple アイコンは商用利用でも無料ですか?

はい。theSVG Color icons は MIT ライセンスで公開されており、個人・商用プロジェクトで利用できます。

React で Snapple アイコンを使うには?

@iconify/react をインストールして <Icon icon="thesvg-color:snapple" /> を描画するか、このページの「コードをコピー」で単体の React コンポーネントを取得します。

Snapple アイコンをウェブページに追加するには?

画像タグで SVG ファイルを読み込みます: <img src="https://iconyz.com/api/public/svg/thesvg-color/snapple.svg" alt="Snapple アイコン">。CSS でスタイルを付けたい場合は SVG コードをページに直接貼り付けます。

theSVG Color アイコンをすべて見る →