sugar icon

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

Name: sugar
Set: Element Plus
Style: Outline
Viewbox: 1024×1024
License: MIT

The same icon in other sets

Use the sugar icon

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 1024 1024"><path fill="currentColor" d="m801.7 349.2l4.5 4.5a128 128 0 0 1 0 181L534.7 806a128 128 0 0 1-181.1 0l-4.5-4.4l-19.4 109.7a64 64 0 0 1-108.3 34.1l-143-143a64 64 0 0 1 34.2-108.2l109.8-19.4l-4.5-4.5a128 128 0 0 1 0-181l271.4-271.5a128 128 0 0 1 181.1 0l4.5 4.4l19.4-109.5a64 64 0 0 1 108.3-34l142.6 143A64 64 0 0 1 911 330zM253 547.9h447.2v2.2l60.8-60.8a64 64 0 0 0 18.7-44.4H352.8L263 534.7a64 64 0 0 0-10.2 13.2zm0 64q4.2 7.1 10.2 13.3l135.7 135.7a64 64 0 0 0 90.5 0l149.1-149zm490-231L625.3 263.1a64 64 0 0 0-90.5 0l-118 117.8zM123.8 757.3l143 143L291 762.7a25.6 25.6 0 0 0-29.7-29.6zM757.3 124L733 261.4a25.6 25.6 0 0 0 29.6 29.7L900 267z"/></svg>

React

import type { SVGProps } from "react";

export function EpSugar(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="m801.7 349.2l4.5 4.5a128 128 0 0 1 0 181L534.7 806a128 128 0 0 1-181.1 0l-4.5-4.4l-19.4 109.7a64 64 0 0 1-108.3 34.1l-143-143a64 64 0 0 1 34.2-108.2l109.8-19.4l-4.5-4.5a128 128 0 0 1 0-181l271.4-271.5a128 128 0 0 1 181.1 0l4.5 4.4l19.4-109.5a64 64 0 0 1 108.3-34l142.6 143A64 64 0 0 1 911 330zM253 547.9h447.2v2.2l60.8-60.8a64 64 0 0 0 18.7-44.4H352.8L263 534.7a64 64 0 0 0-10.2 13.2zm0 64q4.2 7.1 10.2 13.3l135.7 135.7a64 64 0 0 0 90.5 0l149.1-149zm490-231L625.3 263.1a64 64 0 0 0-90.5 0l-118 117.8zM123.8 757.3l143 143L291 762.7a25.6 25.6 0 0 0-29.7-29.6zM757.3 124L733 261.4a25.6 25.6 0 0 0 29.6 29.7L900 267z"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 1024 1024"><path fill="currentColor" d="m801.7 349.2l4.5 4.5a128 128 0 0 1 0 181L534.7 806a128 128 0 0 1-181.1 0l-4.5-4.4l-19.4 109.7a64 64 0 0 1-108.3 34.1l-143-143a64 64 0 0 1 34.2-108.2l109.8-19.4l-4.5-4.5a128 128 0 0 1 0-181l271.4-271.5a128 128 0 0 1 181.1 0l4.5 4.4l19.4-109.5a64 64 0 0 1 108.3-34l142.6 143A64 64 0 0 1 911 330zM253 547.9h447.2v2.2l60.8-60.8a64 64 0 0 0 18.7-44.4H352.8L263 534.7a64 64 0 0 0-10.2 13.2zm0 64q4.2 7.1 10.2 13.3l135.7 135.7a64 64 0 0 0 90.5 0l149.1-149zm490-231L625.3 263.1a64 64 0 0 0-90.5 0l-118 117.8zM123.8 757.3l143 143L291 762.7a25.6 25.6 0 0 0-29.7-29.6zM757.3 124L733 261.4a25.6 25.6 0 0 0 29.6 29.7L900 267z"/></svg>
</template>

CSS

.icon-sugar {
  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%22m801.7%20349.2l4.5%204.5a128%20128%200%200%201%200%20181L534.7%20806a128%20128%200%200%201-181.1%200l-4.5-4.4l-19.4%20109.7a64%2064%200%200%201-108.3%2034.1l-143-143a64%2064%200%200%201%2034.2-108.2l109.8-19.4l-4.5-4.5a128%20128%200%200%201%200-181l271.4-271.5a128%20128%200%200%201%20181.1%200l4.5%204.4l19.4-109.5a64%2064%200%200%201%20108.3-34l142.6%20143A64%2064%200%200%201%20911%20330zM253%20547.9h447.2v2.2l60.8-60.8a64%2064%200%200%200%2018.7-44.4H352.8L263%20534.7a64%2064%200%200%200-10.2%2013.2zm0%2064q4.2%207.1%2010.2%2013.3l135.7%20135.7a64%2064%200%200%200%2090.5%200l149.1-149zm490-231L625.3%20263.1a64%2064%200%200%200-90.5%200l-118%20117.8zM123.8%20757.3l143%20143L291%20762.7a25.6%2025.6%200%200%200-29.7-29.6zM757.3%20124L733%20261.4a25.6%2025.6%200%200%200%2029.6%2029.7L900%20267z%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%22m801.7%20349.2l4.5%204.5a128%20128%200%200%201%200%20181L534.7%20806a128%20128%200%200%201-181.1%200l-4.5-4.4l-19.4%20109.7a64%2064%200%200%201-108.3%2034.1l-143-143a64%2064%200%200%201%2034.2-108.2l109.8-19.4l-4.5-4.5a128%20128%200%200%201%200-181l271.4-271.5a128%20128%200%200%201%20181.1%200l4.5%204.4l19.4-109.5a64%2064%200%200%201%20108.3-34l142.6%20143A64%2064%200%200%201%20911%20330zM253%20547.9h447.2v2.2l60.8-60.8a64%2064%200%200%200%2018.7-44.4H352.8L263%20534.7a64%2064%200%200%200-10.2%2013.2zm0%2064q4.2%207.1%2010.2%2013.3l135.7%20135.7a64%2064%200%200%200%2090.5%200l149.1-149zm490-231L625.3%20263.1a64%2064%200%200%200-90.5%200l-118%20117.8zM123.8%20757.3l143%20143L291%20762.7a25.6%2025.6%200%200%200-29.7-29.6zM757.3%20124L733%20261.4a25.6%2025.6%200%200%200%2029.6%2029.7L900%20267z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

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