watermelon icon

watermelon from Element Plus by Element Plus · Outline · MIT Free for personal and commercial use.

Name
watermelon
Set
Element Plus
Style
Outline
Viewbox
1024×1024
License
MIT

The same icon in other sets

watermelonEmoji One (Colored)watermelonFluent EmojiwatermelonFluent Emoji FlatwatermelonFluent Emoji High ContrastwatermelonFirefox OS EmojiwatermelonHuge IconswatermelonIconParkwatermelonIconPark OutlinewatermelonIconPark SolidwatermelonIconPark TwoTonewatermelonLucide LabwatermelonNoto EmojiwatermelonOpenMojiwatermelonTDesign IconswatermelonTwitter Emoji

Use the watermelon icon

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 1024 1024"><path fill="currentColor" d="m683 600.3l-43.6 162.8l-61.8-16.5l53.2-198.5l-54.8-54.9l-158.4 158.4l-45.2-45.2L530.8 448L475 392.4l-198.5 53.2l-16.5-61.8l162.8-43.6l-140-140.2A384 384 0 0 0 824 741.2zm231.6 141a448 448 0 1 1-632-632z"/></svg>

React

import type { SVGProps } from "react";

export function EpWatermelon(props: SVGProps<SVGSVGElement>) {
  return (
    <svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 1024 1024"><path fill="currentColor" d="m683 600.3l-43.6 162.8l-61.8-16.5l53.2-198.5l-54.8-54.9l-158.4 158.4l-45.2-45.2L530.8 448L475 392.4l-198.5 53.2l-16.5-61.8l162.8-43.6l-140-140.2A384 384 0 0 0 824 741.2zm231.6 141a448 448 0 1 1-632-632z"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 1024 1024"><path fill="currentColor" d="m683 600.3l-43.6 162.8l-61.8-16.5l53.2-198.5l-54.8-54.9l-158.4 158.4l-45.2-45.2L530.8 448L475 392.4l-198.5 53.2l-16.5-61.8l162.8-43.6l-140-140.2A384 384 0 0 0 824 741.2zm231.6 141a448 448 0 1 1-632-632z"/></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%201024%201024%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22m683%20600.3l-43.6%20162.8l-61.8-16.5l53.2-198.5l-54.8-54.9l-158.4%20158.4l-45.2-45.2L530.8%20448L475%20392.4l-198.5%2053.2l-16.5-61.8l162.8-43.6l-140-140.2A384%20384%200%200%200%20824%20741.2zm231.6%20141a448%20448%200%201%201-632-632z%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%201024%201024%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22m683%20600.3l-43.6%20162.8l-61.8-16.5l53.2-198.5l-54.8-54.9l-158.4%20158.4l-45.2-45.2L530.8%20448L475%20392.4l-198.5%2053.2l-16.5-61.8l162.8-43.6l-140-140.2A384%20384%200%200%200%20824%20741.2zm231.6%20141a448%20448%200%201%201-632-632z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/ep/watermelon.svg?color=%231a73e8&size=48