dolphin icon
dolphin from IconPark Outline by ByteDance · Outline · Animals · Apache-2.0 Free for personal and commercial use.
- Name
- dolphin
- Set
- IconPark Outline
- Style
- Outline
- Category
- Animals
- Viewbox
- 48×48
- License
- Apache 2.0
The same icon in other sets
dolphinEmoji One (Colored)dolphinFluent EmojidolphinFluent Emoji FlatdolphinFluent Emoji High ContrastdolphinFirefox OS EmojidolphinIconParkdolphinIconPark SoliddolphinIconPark TwoTonedolphinMaterial Design IconsdolphinNoto EmojidolphinOpenMojidolphinSimple IconsdolphinStreamline EmojisdolphinTwitter Emoji
More animals icons from IconPark Outline
Use the dolphin icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 48 48"><g fill="none"><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="4" d="M24 7C14.23 1.613 9.686 8.632 8 11c-5.664 1.218-2.854 3.324-1 4c1.214.406 4.146 1.323 6 2c.405 3.248 1.663 6.154 2 7c0-.812 1.326-3.647 2-5c8.092 3.248 13.797 11.602 17 16c-1.214 2.436-2.494 6.308-3 8l6-3l7 2c0-3.248-4.145-6.647-6-8c.81-12.992-5.29-20.8-9-23c.405-1.624 1.157-4.323 2-5c-3.237-1.624-5.82.154-7 1"/><circle cx="16" cy="11" r="2" fill="currentColor"/></g></svg>
React
import type { SVGProps } from "react";
export function IconParkOutlineDolphin(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 48 48"><g fill="none"><path stroke="currentColor" strokeLinecap="round" strokeLinejoin="round" strokeWidth="4" d="M24 7C14.23 1.613 9.686 8.632 8 11c-5.664 1.218-2.854 3.324-1 4c1.214.406 4.146 1.323 6 2c.405 3.248 1.663 6.154 2 7c0-.812 1.326-3.647 2-5c8.092 3.248 13.797 11.602 17 16c-1.214 2.436-2.494 6.308-3 8l6-3l7 2c0-3.248-4.145-6.647-6-8c.81-12.992-5.29-20.8-9-23c.405-1.624 1.157-4.323 2-5c-3.237-1.624-5.82.154-7 1"/><circle cx="16" cy="11" r="2" fill="currentColor"/></g></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 48 48"><g fill="none"><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="4" d="M24 7C14.23 1.613 9.686 8.632 8 11c-5.664 1.218-2.854 3.324-1 4c1.214.406 4.146 1.323 6 2c.405 3.248 1.663 6.154 2 7c0-.812 1.326-3.647 2-5c8.092 3.248 13.797 11.602 17 16c-1.214 2.436-2.494 6.308-3 8l6-3l7 2c0-3.248-4.145-6.647-6-8c.81-12.992-5.29-20.8-9-23c.405-1.624 1.157-4.323 2-5c-3.237-1.624-5.82.154-7 1"/><circle cx="16" cy="11" r="2" fill="currentColor"/></g></svg> </template>
CSS
.icon-dolphin {
width: 24px;
height: 24px;
background-color: currentColor;
-webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%221em%22%20height%3D%221em%22%20viewBox%3D%220%200%2048%2048%22%3E%3Cg%20fill%3D%22none%22%3E%3Cpath%20stroke%3D%22currentColor%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%224%22%20d%3D%22M24%207C14.23%201.613%209.686%208.632%208%2011c-5.664%201.218-2.854%203.324-1%204c1.214.406%204.146%201.323%206%202c.405%203.248%201.663%206.154%202%207c0-.812%201.326-3.647%202-5c8.092%203.248%2013.797%2011.602%2017%2016c-1.214%202.436-2.494%206.308-3%208l6-3l7%202c0-3.248-4.145-6.647-6-8c.81-12.992-5.29-20.8-9-23c.405-1.624%201.157-4.323%202-5c-3.237-1.624-5.82.154-7%201%22%2F%3E%3Ccircle%20cx%3D%2216%22%20cy%3D%2211%22%20r%3D%222%22%20fill%3D%22currentColor%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E") no-repeat center / contain;
mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%221em%22%20height%3D%221em%22%20viewBox%3D%220%200%2048%2048%22%3E%3Cg%20fill%3D%22none%22%3E%3Cpath%20stroke%3D%22currentColor%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%224%22%20d%3D%22M24%207C14.23%201.613%209.686%208.632%208%2011c-5.664%201.218-2.854%203.324-1%204c1.214.406%204.146%201.323%206%202c.405%203.248%201.663%206.154%202%207c0-.812%201.326-3.647%202-5c8.092%203.248%2013.797%2011.602%2017%2016c-1.214%202.436-2.494%206.308-3%208l6-3l7%202c0-3.248-4.145-6.647-6-8c.81-12.992-5.29-20.8-9-23c.405-1.624%201.157-4.323%202-5c-3.237-1.624-5.82.154-7%201%22%2F%3E%3Ccircle%20cx%3D%2216%22%20cy%3D%2211%22%20r%3D%222%22%20fill%3D%22currentColor%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/icon-park-outline/dolphin.svg?color=%231a73e8&size=48