watermelon icon
watermelon from IconPark Solid by ByteDance · Solid · Foods · Apache-2.0 Free for personal and commercial use.
- Name
- watermelon
- Set
- IconPark Solid
- Style
- Solid
- Category
- Foods
- Viewbox
- 48×48
- License
- Apache 2.0
The same icon in other sets
watermelonEmoji One (Colored)watermelonElement PluswatermelonFluent EmojiwatermelonFluent Emoji FlatwatermelonFluent Emoji High ContrastwatermelonFirefox OS EmojiwatermelonHuge IconswatermelonIconParkwatermelonIconPark OutlinewatermelonIconPark TwoTonewatermelonLucide LabwatermelonNoto EmojiwatermelonOpenMojiwatermelonTDesign IconswatermelonTwitter Emoji
More foods icons from IconPark Solid
Use the watermelon icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 48 48"><defs><mask id="SVG6EkOAb1c"><g fill="none" stroke-linejoin="round" stroke-width="4"><path fill="#fff" stroke="#fff" d="M23 34c11.046 0 20-8.954 20-20H3c0 11.046 8.954 20 20 20Z"/><path stroke="#000" stroke-linecap="round" d="M23 23v3m-6.364-5.636l-2.121 2.121m14.849-2.121l2.122 2.121"/></g></mask></defs><path fill="currentColor" d="M0 0h48v48H0z" mask="url(#SVG6EkOAb1c)"/></svg>
React
import type { SVGProps } from "react";
export function IconParkSolidWatermelon(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 48 48"><defs><mask id="SVG6EkOAb1c"><g fill="none" strokeLinejoin="round" strokeWidth="4"><path fill="#fff" stroke="#fff" d="M23 34c11.046 0 20-8.954 20-20H3c0 11.046 8.954 20 20 20Z"/><path stroke="#000" strokeLinecap="round" d="M23 23v3m-6.364-5.636l-2.121 2.121m14.849-2.121l2.122 2.121"/></g></mask></defs><path fill="currentColor" d="M0 0h48v48H0z" mask="url(#SVG6EkOAb1c)"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 48 48"><defs><mask id="SVG6EkOAb1c"><g fill="none" stroke-linejoin="round" stroke-width="4"><path fill="#fff" stroke="#fff" d="M23 34c11.046 0 20-8.954 20-20H3c0 11.046 8.954 20 20 20Z"/><path stroke="#000" stroke-linecap="round" d="M23 23v3m-6.364-5.636l-2.121 2.121m14.849-2.121l2.122 2.121"/></g></mask></defs><path fill="currentColor" d="M0 0h48v48H0z" mask="url(#SVG6EkOAb1c)"/></svg> </template>
CSS
.icon-watermelon {
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%3Cdefs%3E%3Cmask%20id%3D%22SVG6EkOAb1c%22%3E%3Cg%20fill%3D%22none%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%224%22%3E%3Cpath%20fill%3D%22%23fff%22%20stroke%3D%22%23fff%22%20d%3D%22M23%2034c11.046%200%2020-8.954%2020-20H3c0%2011.046%208.954%2020%2020%2020Z%22%2F%3E%3Cpath%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20d%3D%22M23%2023v3m-6.364-5.636l-2.121%202.121m14.849-2.121l2.122%202.121%22%2F%3E%3C%2Fg%3E%3C%2Fmask%3E%3C%2Fdefs%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M0%200h48v48H0z%22%20mask%3D%22url(%23SVG6EkOAb1c)%22%2F%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%3Cdefs%3E%3Cmask%20id%3D%22SVG6EkOAb1c%22%3E%3Cg%20fill%3D%22none%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%224%22%3E%3Cpath%20fill%3D%22%23fff%22%20stroke%3D%22%23fff%22%20d%3D%22M23%2034c11.046%200%2020-8.954%2020-20H3c0%2011.046%208.954%2020%2020%2020Z%22%2F%3E%3Cpath%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20d%3D%22M23%2023v3m-6.364-5.636l-2.121%202.121m14.849-2.121l2.122%202.121%22%2F%3E%3C%2Fg%3E%3C%2Fmask%3E%3C%2Fdefs%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M0%200h48v48H0z%22%20mask%3D%22url(%23SVG6EkOAb1c)%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/icon-park-solid/watermelon.svg?color=%231a73e8&size=48