Mermaid icon

game-icons:mermaid

The Mermaid icon (game-icons:mermaid) is a free SVG icon from the Game Icons set by GameIcons. It is drawn on a 512 × 512 grid. Game Icons are released under the CC BY 3.0 license, which allows use in personal and commercial projects as long as you credit the author. Copy it as SVG, JSX, Vue or Svelte code, or download the SVG file.

Icon set: Game Icons
Author: GameIcons
License: CC-BY-3.0
Size: 512 × 512

Download SVG

SVG code

<svg xmlns="http://www.w3.org/2000/svg" width="512" height="512" viewBox="0 0 512 512"><path fill="currentColor" d="M193.469 28.412c-17.378 4.426-17.777 17.713-24.166 28.545c15.713 3.49 31.499 5.431 47.31 6.824c-19.026 2.612-37.99 5.671-57.69 3.434c-3.78 2.08-8.637 3.668-15.062 4.521c-38.245 5.079-85.586-7.08-85.586-7.08C73 78.528 89.938 89.776 108.242 98.553c20.597 2.879 41.542 4.01 62.596 4.605c-14.231 1.502-28.446 3.14-42.775 3.756c32.652 11.983 65.808 17.573 100.643 15.921c-6.721 12.789-23.731 33.608-33.272 39.397c-31.955-3.837-47.598-15.35-68.774-31.885l-11.078 14.184c25.514 18.283 58.257 33.97 83.658 36.12c12.047-5.934 21.5-16.053 29.97-26.266l-.044 1.138c19.632 8.81 23.686 9.035 41.809.64c12.495 8.096 28.717 9.24 32.097-6.782c17.973 16.734 25.381 23.735 43.123 32.507c28.711-11.692 55.616-30.207 76.448-46.279l-11.014-14.234c-21.06 15.793-43.916 32.285-64.316 40.746c-17.586-9.322-21.863-16.197-34.504-28.453c-4.613-9.585-14.124-13.605-22.29-14.487c-6.373 5.265-14.388 8.419-22.765 7.182c-10.082-1.488-17.546-8.862-21.58-17.723s-5.23-19.638-3.299-30.898s6.675-21.16 13.475-28.422c6.8-7.261 16.363-12.121 26.445-10.633s17.55 8.862 21.584 17.723c1.473 3.235 2.563 6.728 3.266 10.404a88 88 0 0 0 2.601-6.926c7.034-29.675-21.68-38.714-54.35-39.08c-20.574.29-43.074 2.777-62.427 7.604m187.578 7.5c-8.284 0-15 6.716-15 15s6.716 15 15 15s15-6.716 15-15s-6.716-15-15-15M269.453 61.375c-3.875 4.138-7.39 10.945-8.771 18.996s-.317 15.534 1.982 20.584s5.24 7.239 8.135 7.666s6.421-.807 10.297-4.945c3.875-4.139 7.392-10.944 8.773-18.995s.317-15.535-1.982-20.585s-5.24-7.237-8.135-7.665c-4.243-.231-8.269 2.82-10.299 4.944m80.23 22.79a9 9 0 1 0 0 18a9 9 0 0 0 0-18m-79.222 91.854c-14.977 6.472-25.22 5.696-39.422.01c1.657 6.73 4.533 13.244 9.236 19.672c-7.69 7.912-9.967 15.823-12.443 23.735c9.483-6.672 20.662-11.111 31.904-13.77c11.493-2.718 23.226-3.79 34.174-3.5c6.357.169 12.435.81 18.06 1.842c-4.633-6.1-10.807-12.073-19.199-16.899a91 91 0 0 0 2.631-6.26c-8.403 1.84-18.083-1.48-24.941-4.83m16.525 43.493c-19.483.122-39.377 5.801-53.25 17.898c-10.861 9.47-16.423 26.89-13.629 41.027c11.581 58.596 119.687 76.114 116.93 135.78c-1.093 23.664-27.954 44.51-51.144 49.345c-24.584 5.126-70.604-26.283-70.604-26.283c28.785-55.458-.113-92.09-25.201-113.807c-2.41 30.637-14.38 61.716-5.627 91.172c-38.792-3.27-54.86 4.952-98.57-3.873c18.825 25.928 63.62 59.958 116.382 40.276c0 0 40.045 37.29 65.422 39.492c45.336 3.934 105.162-9.596 127.28-49.365c29.11-52.343-3.15-124.766-33.178-176.588c-10.785-18.612-28.317-36.327-49.1-41.88c-8.083-2.158-16.854-3.25-25.71-3.194zM72.008 237.058c-8.284 0-15 6.716-15 15c0 8.285 6.716 15 15 15s15-6.715 15-15s-6.716-15-15-15m-15.682 76.297a9 9 0 1 0 0 18a9 9 0 0 0 0-18m36.381 39.02a9 9 0 1 0 0 18a9 9 0 0 0 0-18"/></svg>

How to use the Mermaid icon

React

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

<Icon icon="game-icons:mermaid" width="24" />

Vue

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

<template>
  <Icon icon="game-icons:mermaid" width="24" />
</template>

Svelte

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

<Icon icon="game-icons:mermaid" width="24" />

Tailwind CSS

<!-- @iconify/tailwind plugin -->
<span class="icon-[game-icons--mermaid]"></span>

UnoCSS

<!-- @unocss/preset-icons + @iconify-json/game-icons -->
<div class="i-game-icons:mermaid"></div>

Web component

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

<iconify-icon icon="game-icons:mermaid"></iconify-icon>

HTML image

<img src="https://iconyz.com/api/public/svg/game-icons/mermaid.svg" alt="Mermaid icon" width="24" height="24">

Mermaid icon in other icon sets

Mermaid icon FAQ

Is the Mermaid icon free for commercial use?

Yes. Game Icons are released under the CC BY 3.0 license, which allows use in personal and commercial projects as long as you credit the author.

How do I use the Mermaid icon in React?

Install @iconify/react and render <Icon icon="game-icons:mermaid" />, or use “Copy code” on this page to get a standalone React component.

How do I add the Mermaid icon to a web page?

Link the SVG file in an image tag: <img src="https://iconyz.com/api/public/svg/game-icons/mermaid.svg" alt="Mermaid icon">, or paste the SVG code inline to style it with CSS.

Browse all Game Icons →