dolphin icon
dolphin from IconPark by ByteDance · Color · Animals · Apache-2.0 Free for personal and commercial use.
- Name
- dolphin
- Set
- IconPark
- Style
- Color
- 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 EmojidolphinIconPark OutlinedolphinIconPark SoliddolphinIconPark TwoTonedolphinMaterial Design IconsdolphinNoto EmojidolphinOpenMojidolphinSimple IconsdolphinStreamline EmojisdolphinTwitter Emoji
More animals icons from IconPark
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 fill="#2F88FF" stroke="#000" stroke-linecap="round" stroke-linejoin="round" stroke-width="4" d="M24.0002 7.00002C14.2305 1.61313 9.68601 8.63202 8.00016 11.0004C2.33569 12.2184 5.14579 14.3237 7.00023 15.0004C8.21404 15.4064 11.1458 16.3233 13.0002 16.9999C13.4048 20.248 14.6631 23.1541 15.0002 23.9999C15.0002 23.1879 16.3259 20.3533 17.0002 18.9999C25.0923 22.248 30.7971 30.6015 34.0002 34.9999C32.7864 37.436 31.506 41.3082 31.0002 42.9999L37.0002 40L44.0002 42C44.0002 38.7519 39.8547 35.3534 38.0002 34C38.8095 21.0076 32.7091 13.1993 29.0002 11C29.4048 9.37598 30.1573 6.67671 31.0002 6.00002C27.7634 4.37598 25.1803 6.15418 24.0002 7.00002Z"/><circle cx="16" cy="11" r="2" fill="#fff"/></g></svg>
React
import type { SVGProps } from "react";
export function IconParkDolphin(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 fill="#2F88FF" stroke="#000" strokeLinecap="round" strokeLinejoin="round" strokeWidth="4" d="M24.0002 7.00002C14.2305 1.61313 9.68601 8.63202 8.00016 11.0004C2.33569 12.2184 5.14579 14.3237 7.00023 15.0004C8.21404 15.4064 11.1458 16.3233 13.0002 16.9999C13.4048 20.248 14.6631 23.1541 15.0002 23.9999C15.0002 23.1879 16.3259 20.3533 17.0002 18.9999C25.0923 22.248 30.7971 30.6015 34.0002 34.9999C32.7864 37.436 31.506 41.3082 31.0002 42.9999L37.0002 40L44.0002 42C44.0002 38.7519 39.8547 35.3534 38.0002 34C38.8095 21.0076 32.7091 13.1993 29.0002 11C29.4048 9.37598 30.1573 6.67671 31.0002 6.00002C27.7634 4.37598 25.1803 6.15418 24.0002 7.00002Z"/><circle cx="16" cy="11" r="2" fill="#fff"/></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 fill="#2F88FF" stroke="#000" stroke-linecap="round" stroke-linejoin="round" stroke-width="4" d="M24.0002 7.00002C14.2305 1.61313 9.68601 8.63202 8.00016 11.0004C2.33569 12.2184 5.14579 14.3237 7.00023 15.0004C8.21404 15.4064 11.1458 16.3233 13.0002 16.9999C13.4048 20.248 14.6631 23.1541 15.0002 23.9999C15.0002 23.1879 16.3259 20.3533 17.0002 18.9999C25.0923 22.248 30.7971 30.6015 34.0002 34.9999C32.7864 37.436 31.506 41.3082 31.0002 42.9999L37.0002 40L44.0002 42C44.0002 38.7519 39.8547 35.3534 38.0002 34C38.8095 21.0076 32.7091 13.1993 29.0002 11C29.4048 9.37598 30.1573 6.67671 31.0002 6.00002C27.7634 4.37598 25.1803 6.15418 24.0002 7.00002Z"/><circle cx="16" cy="11" r="2" fill="#fff"/></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%20fill%3D%22%232F88FF%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%224%22%20d%3D%22M24.0002%207.00002C14.2305%201.61313%209.68601%208.63202%208.00016%2011.0004C2.33569%2012.2184%205.14579%2014.3237%207.00023%2015.0004C8.21404%2015.4064%2011.1458%2016.3233%2013.0002%2016.9999C13.4048%2020.248%2014.6631%2023.1541%2015.0002%2023.9999C15.0002%2023.1879%2016.3259%2020.3533%2017.0002%2018.9999C25.0923%2022.248%2030.7971%2030.6015%2034.0002%2034.9999C32.7864%2037.436%2031.506%2041.3082%2031.0002%2042.9999L37.0002%2040L44.0002%2042C44.0002%2038.7519%2039.8547%2035.3534%2038.0002%2034C38.8095%2021.0076%2032.7091%2013.1993%2029.0002%2011C29.4048%209.37598%2030.1573%206.67671%2031.0002%206.00002C27.7634%204.37598%2025.1803%206.15418%2024.0002%207.00002Z%22%2F%3E%3Ccircle%20cx%3D%2216%22%20cy%3D%2211%22%20r%3D%222%22%20fill%3D%22%23fff%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%20fill%3D%22%232F88FF%22%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%224%22%20d%3D%22M24.0002%207.00002C14.2305%201.61313%209.68601%208.63202%208.00016%2011.0004C2.33569%2012.2184%205.14579%2014.3237%207.00023%2015.0004C8.21404%2015.4064%2011.1458%2016.3233%2013.0002%2016.9999C13.4048%2020.248%2014.6631%2023.1541%2015.0002%2023.9999C15.0002%2023.1879%2016.3259%2020.3533%2017.0002%2018.9999C25.0923%2022.248%2030.7971%2030.6015%2034.0002%2034.9999C32.7864%2037.436%2031.506%2041.3082%2031.0002%2042.9999L37.0002%2040L44.0002%2042C44.0002%2038.7519%2039.8547%2035.3534%2038.0002%2034C38.8095%2021.0076%2032.7091%2013.1993%2029.0002%2011C29.4048%209.37598%2030.1573%206.67671%2031.0002%206.00002C27.7634%204.37598%2025.1803%206.15418%2024.0002%207.00002Z%22%2F%3E%3Ccircle%20cx%3D%2216%22%20cy%3D%2211%22%20r%3D%222%22%20fill%3D%22%23fff%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/dolphin.svg?color=%231a73e8&size=48
