Water Wave アイコン

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

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

fluent-emoji:water-wave

Water Wave アイコン(fluent-emoji:water-wave)は、Fluent Emoji セットの無料 SVG アイコンです（作者: Microsoft Corporation）。 32 × 32 のグリッドで描かれています。 Fluent Emoji icons は MIT ライセンスで公開されており、個人・商用プロジェクトで利用できます。 SVG・JSX・Vue・Svelte のコードとしてコピーするか、SVG ファイルをダウンロードできます。

アイコンセット: Fluent Emoji
作者: Microsoft Corporation
ライセンス: MIT
サイズ: 32 × 32
タグ: waterwave

SVG をダウンロード

SVG コード

<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32"><g fill="none"><path fill="#4AB9FF" d="M18.208 8.429V5.886H6.509v20.899h18.98l.715-6.545c-2.726 2.513-5.208 2.775-7.917 2.775c-3.963 0-7.294-3.448-7.294-7.41a7.176 7.176 0 0 1 7.215-7.176"/><path fill="url(#irVWBae)" d="M18.208 8.429V5.886H6.509v20.899h18.98l.715-6.545c-2.726 2.513-5.208 2.775-7.917 2.775c-3.963 0-7.294-3.448-7.294-7.41a7.176 7.176 0 0 1 7.215-7.176"/><path fill="url(#i7ZR4ye)" d="M18.208 8.429V5.886H6.509v20.899h18.98l.715-6.545c-2.726 2.513-5.208 2.775-7.917 2.775c-3.963 0-7.294-3.448-7.294-7.41a7.176 7.176 0 0 1 7.215-7.176"/><g filter="url(#isQXj2I)"><path fill="url(#iaavO6b)" d="M2.004 15.154v14.838h27.99V17.844c-2.488.92-4.011 2.663-5.881 4.185c-1.773 1.442-3.962 2.69-7.11 2.69c-4.249 0-9.196-3.822-9.196-8.833c0-6.019 5.182-8.585 8.035-8.585c1.148 0 1.638.245 1.834.367l1.21 1.65h4.183v-.953c-.672-1.896-3.544-5.687-9.649-5.687c-5.613 0-11.416 5.687-11.416 12.476"/></g><path fill="url(#iDNoIDo)" d="M2.004 15.154v14.838h27.99V17.844c-2.488.92-4.011 2.663-5.881 4.185c-1.773 1.442-3.962 2.69-7.11 2.69c-4.249 0-9.196-3.822-9.196-8.833c0-6.019 5.182-8.585 8.035-8.585c1.148 0 1.638.245 1.834.367l1.21 1.65h4.183v-.953c-.672-1.896-3.544-5.687-9.649-5.687c-5.613 0-11.416 5.687-11.416 12.476"/><path fill="url(#ii4kRnd)" d="M2.004 15.154v14.838h27.99V17.844c-2.488.92-4.011 2.663-5.881 4.185c-1.773 1.442-3.962 2.69-7.11 2.69c-4.249 0-9.196-3.822-9.196-8.833c0-6.019 5.182-8.585 8.035-8.585c1.148 0 1.638.245 1.834.367l1.21 1.65h4.183v-.953c-.672-1.896-3.544-5.687-9.649-5.687c-5.613 0-11.416 5.687-11.416 12.476"/><path fill="url(#iEdezKb)" d="M2.004 15.154v14.838h27.99V17.844c-2.488.92-4.011 2.663-5.881 4.185c-1.773 1.442-3.962 2.69-7.11 2.69c-4.249 0-9.196-3.822-9.196-8.833c0-6.019 5.182-8.585 8.035-8.585c1.148 0 1.638.245 1.834.367l1.21 1.65h4.183v-.953c-.672-1.896-3.544-5.687-9.649-5.687c-5.613 0-11.416 5.687-11.416 12.476"/><g filter="url(#iaKE0Fc)"><path fill="url(#ily1Mwc)" d="M9.437 4.262c6.923-2.888 11.634 1.204 13.124 3.61l-2.637.631c-2.108-5.135-7.87-4.967-10.487-4.24"/></g><circle cx="27.403" cy="8.958" r="1.138" fill="url(#i4CftHe)"/><circle cx="27.403" cy="8.958" r="1.138" fill="url(#i6Inhhb)"/><circle cx="27.403" cy="14.796" r="1.138" fill="url(#iuP8tbb)"/><circle cx="27.403" cy="14.796" r="1.138" fill="url(#iYioxqW)"/><g filter="url(#iPXZ1gd)"><circle cx="17.525" cy="13.957" r="1.138" fill="url(#ikBrXuj)"/></g><circle cx="20.534" cy="5.682" r="1.138" fill="url(#ifz7Veb)"/><g fill-rule="evenodd" clip-rule="evenodd" filter="url(#iA2s5ie)"><path fill="#A1E5FF" d="M16.404 11.098a2.66 2.66 0 1 1 0-3.477a2.657 2.657 0 0 1 4.214.244a2.66 2.66 0 1 1 0 2.99a2.657 2.657 0 0 1-4.214.243"/><path fill="url(#i3X03td)" d="M16.404 11.098a2.66 2.66 0 1 1 0-3.477a2.657 2.657 0 0 1 4.214.244a2.66 2.66 0 1 1 0 2.99a2.657 2.657 0 0 1-4.214.243"/><path fill="url(#iM1KPXp)" d="M16.404 11.098a2.66 2.66 0 1 1 0-3.477a2.657 2.657 0 0 1 4.214.244a2.66 2.66 0 1 1 0 2.99a2.657 2.657 0 0 1-4.214.243"/><path fill="url(#ikiBu7c)" d="M16.404 11.098a2.66 2.66 0 1 1 0-3.477a2.657 2.657 0 0 1 4.214.244a2.66 2.66 0 1 1 0 2.99a2.657 2.657 0 0 1-4.214.243"/><path fill="url(#iIwEUPd)" d="M16.404 11.098a2.66 2.66 0 1 1 0-3.477a2.657 2.657 0 0 1 4.214.244a2.66 2.66 0 1 1 0 2.99a2.657 2.657 0 0 1-4.214.243"/><path fill="url(#iO9GJzc)" d="M16.404 11.098a2.66 2.66 0 1 1 0-3.477a2.657 2.657 0 0 1 4.214.244a2.66 2.66 0 1 1 0 2.99a2.657 2.657 0 0 1-4.214.243"/><path fill="url(#iHZydjH)" d="M16.404 11.098a2.66 2.66 0 1 1 0-3.477a2.657 2.657 0 0 1 4.214.244a2.66 2.66 0 1 1 0 2.99a2.657 2.657 0 0 1-4.214.243"/></g><path fill="url(#iFgN1ce)" fill-rule="evenodd" d="M16.404 11.098a2.66 2.66 0 1 1 0-3.477a2.657 2.657 0 0 1 4.214.244a2.66 2.66 0 1 1 0 2.99a2.657 2.657 0 0 1-4.214.243" clip-rule="evenodd"/><circle cx="24.5" cy="11.877" r="1.138" fill="url(#i3LdhQb)"/><defs><radialGradient id="irVWBae" cx="0" cy="0" r="1" gradientTransform="matrix(5.48453 -5.2234 11.62845 12.2098 11.578 24.092)" gradientUnits="userSpaceOnUse"><stop stop-color="#52C2FF"/><stop offset="1" stop-color="#52C2FF" stop-opacity="0"/></radialGradient><radialGradient id="i7ZR4ye" cx="0" cy="0" r="1" gradientTransform="rotate(125.538 3.98 11.792)scale(8.42498 8.82776)" gradientUnits="userSpaceOnUse"><stop offset=".813" stop-color="#5DC8FF" stop-opacity="0"/><stop offset="1" stop-color="#5DC8FF"/></radialGradient><radialGradient id="iEdezKb" cx="0" cy="0" r="1" gradientTransform="matrix(3.80997 4.04984 -5.45541 5.1323 13.687 12.286)" gradientUnits="userSpaceOnUse"><stop offset=".33" stop-color="#40A3EE"/><stop offset="1" stop-color="#40A3EE" stop-opacity="0"/></radialGradient><radialGradient id="i4CftHe" cx="0" cy="0" r="1" gradientTransform="rotate(143.207 12.568 8.935)scale(1.64856)" gradientUnits="userSpaceOnUse"><stop stop-color="#BFF7FF"/><stop offset="1" stop-color="#8FD9FE"/></radialGradient><radialGradient id="i6Inhhb" cx="0" cy="0" r="1" gradientTransform="rotate(90 9.374 18.029)scale(1.44012)" gradientUnits="userSpaceOnUse"><stop offset=".738" stop-color="#85CCF6" stop-opacity="0"/><stop offset="1" stop-color="#85CCF6"/></radialGradient><radialGradient id="iuP8tbb" cx="0" cy="0" r="1" gradientTransform="rotate(135.89 11.1 12.736)scale(1.77167)" gradientUnits="userSpaceOnUse"><stop stop-color="#BFF4FF"/><stop offset="1" stop-color="#90D0F8"/></radialGradient><radialGradient id="iYioxqW" cx="0" cy="0" r="1" gradientTransform="rotate(124.958 10.245 14.39)scale(1.93867)" gradientUnits="userSpaceOnUse"><stop offset=".738" stop-color="#85CCF6" stop-opacity="0"/><stop offset="1" stop-color="#85CCF6"/></radialGradient><radialGradient id="ikBrXuj" cx="0" cy="0" r="1" gradientTransform="matrix(-1.29127 .9337 -1.16175 -1.60666 18.054 13.76)" gradientUnits="userSpaceOnUse"><stop stop-color="#A8DDFF"/><stop offset="1" stop-color="#8AC7FB"/></radialGradient><radialGradient id="ifz7Veb" cx="0" cy="0" r="1" gradientTransform="rotate(137.626 9.437 6.724)scale(1.53118 1.5088)" gradientUnits="userSpaceOnUse"><stop stop-color="#BBF7FF"/><stop offset="1" stop-color="#85DEFB"/></radialGradient><radialGradient id="i3X03td" cx="0" cy="0" r="1" gradientTransform="matrix(-11.7407 0 0 -8.34033 22.722 9.36)" gradientUnits="userSpaceOnUse"><stop offset=".719" stop-color="#86CCEE" stop-opacity="0"/><stop offset="1" stop-color="#86CCEE"/></radialGradient><radialGradient id="iM1KPXp" cx="0" cy="0" r="1" gradientTransform="rotate(-101.877 15.473 .536)scale(8.04728 3.78154)" gradientUnits="userSpaceOnUse"><stop stop-color="#86CCEE"/><stop offset=".991" stop-color="#86CCEE" stop-opacity="0"/></radialGradient><radialGradient id="ikiBu7c" cx="0" cy="0" r="1" gradientTransform="matrix(-2.46873 -6.34375 2.98102 -1.1601 23.634 14.35)" gradientUnits="userSpaceOnUse"><stop stop-color="#86CCEE"/><stop offset=".991" stop-color="#86CCEE" stop-opacity="0"/></radialGradient><radialGradient id="iIwEUPd" cx="0" cy="0" r="1" gradientTransform="matrix(-2.24458 1.25697 -1.24245 -2.21865 15.089 8.497)" gradientUnits="userSpaceOnUse"><stop offset=".194" stop-color="#BBF4FF"/><stop offset="1" stop-color="#BBF4FF" stop-opacity="0"/></radialGradient><radialGradient id="iO9GJzc" cx="0" cy="0" r="1" gradientTransform="matrix(-2.1997 .7723 -.76338 -2.17427 19.533 8.587)" gradientUnits="userSpaceOnUse"><stop offset=".194" stop-color="#BBF4FF"/><stop offset="1" stop-color="#BBF4FF" stop-opacity="0"/></radialGradient><radialGradient id="iHZydjH" cx="0" cy="0" r="1" gradientTransform="matrix(-2.6935 1.42325 -1.43833 -2.72204 24.471 7.936)" gradientUnits="userSpaceOnUse"><stop stop-color="#BBF4FF"/><stop offset="1" stop-color="#BBF4FF" stop-opacity="0"/></radialGradient><radialGradient id="iFgN1ce" cx="0" cy="0" r="1" gradientTransform="rotate(140.845 11.482 8.065)scale(3.62695 3.90833)" gradientUnits="userSpaceOnUse"><stop stop-color="#C3FDFF"/><stop offset="1" stop-color="#C3FDFF" stop-opacity="0"/></radialGradient><radialGradient id="i3LdhQb" cx="0" cy="0" r="1" gradientTransform="matrix(-1.4204 1.57934 -1.8827 -1.69322 25.196 11.287)" gradientUnits="userSpaceOnUse"><stop offset=".143" stop-color="#BDF3FF"/><stop offset="1" stop-color="#83C5F7"/></radialGradient><linearGradient id="iaavO6b" x1="15.999" x2="15.999" y1="2.678" y2="29.992" gradientUnits="userSpaceOnUse"><stop stop-color="#52C3FB"/><stop offset="1" stop-color="#3E7FF0"/></linearGradient><linearGradient id="iDNoIDo" x1="15.999" x2="15.999" y1="1.821" y2="15.116" gradientUnits="userSpaceOnUse"><stop stop-color="#53C2F9"/><stop offset="1" stop-color="#53C2F9" stop-opacity="0"/></linearGradient><linearGradient id="ii4kRnd" x1="17.259" x2="17.259" y1="29.992" y2="29.087" gradientUnits="userSpaceOnUse"><stop stop-color="#2E6DEA"/><stop offset="1" stop-color="#2E6DEA" stop-opacity="0"/></linearGradient><linearGradient id="ily1Mwc" x1="21.3" x2="5.199" y1="7.873" y2="1.763" gradientUnits="userSpaceOnUse"><stop stop-color="#74DEFF"/><stop offset="1" stop-color="#74DEFF" stop-opacity="0"/></linearGradient><filter id="isQXj2I" width="28.74" height="27.814" x="1.754" y="2.678" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feColorMatrix in="SourceAlpha" result="hardAlpha" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"/><feOffset dx="-.25" dy=".5"/><feGaussianBlur stdDeviation=".25"/><feComposite in2="hardAlpha" k2="-1" k3="1" operator="arithmetic"/><feColorMatrix values="0 0 0 0 0.309804 0 0 0 0 0.611765 0 0 0 0 0.996078 0 0 0 1 0"/><feBlend in2="shape" result="effect1_innerShadow_18_15842"/><feColorMatrix in="SourceAlpha" result="hardAlpha" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"/><feOffset dx=".5" dy=".25"/><feGaussianBlur stdDeviation=".5"/><feComposite in2="hardAlpha" k2="-1" k3="1" operator="arithmetic"/><feColorMatrix values="0 0 0 0 0.180392 0 0 0 0 0.501961 0 0 0 0 0.882353 0 0 0 1 0"/><feBlend in2="effect1_innerShadow_18_15842" result="effect2_innerShadow_18_15842"/></filter><filter id="iaKE0Fc" width="15.623" height="7.734" x="8.187" y="2.019" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feGaussianBlur result="effect1_foregroundBlur_18_15842" stdDeviation=".625"/></filter><filter id="iPXZ1gd" width="2.375" height="2.375" x="16.388" y="12.72" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feColorMatrix in="SourceAlpha" result="hardAlpha" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"/><feOffset dx=".1" dy="-.1"/><feGaussianBlur stdDeviation=".25"/><feComposite in2="hardAlpha" k2="-1" k3="1" operator="arithmetic"/><feColorMatrix values="0 0 0 0 0.505882 0 0 0 0 0.745098 0 0 0 0 0.972549 0 0 0 1 0"/><feBlend in2="shape" result="effect1_innerShadow_18_15842"/></filter><filter id="iA2s5ie" width="13.747" height="5.62" x="11.731" y="6.4" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feColorMatrix in="SourceAlpha" result="hardAlpha" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"/><feOffset dy="-.3"/><feGaussianBlur stdDeviation=".625"/><feComposite in2="hardAlpha" k2="-1" k3="1" operator="arithmetic"/><feColorMatrix values="0 0 0 0 0.498039 0 0 0 0 0.741176 0 0 0 0 0.956863 0 0 0 1 0"/><feBlend in2="shape" result="effect1_innerShadow_18_15842"/></filter></defs></g></svg>

Water Wave アイコンの使い方

React

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

<Icon icon="fluent-emoji:water-wave" width="24" />

Vue

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

<template>
  <Icon icon="fluent-emoji:water-wave" width="24" />
</template>

Svelte

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

<Icon icon="fluent-emoji:water-wave" width="24" />

Tailwind CSS

<!-- @iconify/tailwind plugin -->
<span class="icon-[fluent-emoji--water-wave]"></span>

UnoCSS

<!-- @unocss/preset-icons + @iconify-json/fluent-emoji -->
<div class="i-fluent-emoji:water-wave"></div>

Web コンポーネント

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

<iconify-icon icon="fluent-emoji:water-wave"></iconify-icon>

HTML 画像

<img src="https://iconyz.com/api/public/svg/fluent-emoji/water-wave.svg" alt="Water Wave アイコン" width="24" height="24">

Fluent Emoji の関連アイコン

他のアイコンセットの Water Wave アイコン

Water Wave アイコンのよくある質問

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

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

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

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

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

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

Fluent Emoji アイコンをすべて見る →