leaf icon

leaf from Phosphor by Phosphor Icons · Regular · MIT Free for personal and commercial use.

Name
leaf
Set
Phosphor
Style
Regular
Viewbox
256×256
License
MIT

5 other variants in Phosphor

leaf-boldleaf-duotoneleaf-fillleaf-lightleaf-thin

The same icon in other sets

leafAkar IconsleafBootstrap IconsleafBoxIcons v2leafBoxIcons v2 SolidleafFont Awesome 6 Solidleaf-20-filledFluent UI System IconsleafIconoirleafIonIconsleafJam IconsleafLine AwesomeleafLucideleafMaterial Design Iconsleaf-fillMingCute IconleafPixelarticonsleaf-fillRemix Iconleaf-boldSolarleafTabler Icons

Use the leaf icon

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 256"><path fill="currentColor" d="M223.45 40.07a8 8 0 0 0-7.52-7.52C139.8 28.08 78.82 51 52.82 94a87.1 87.1 0 0 0-12.76 49c.57 15.92 5.21 32 13.79 47.85l-19.51 19.5a8 8 0 0 0 11.32 11.32l19.5-19.51C81 210.73 97.09 215.37 113 215.94q1.67.06 3.33.06A86.93 86.93 0 0 0 162 203.18c43-26 65.93-86.97 61.45-163.11m-69.7 149.43c-22.75 13.78-49.68 14-76.71.77l88.63-88.62a8 8 0 0 0-11.32-11.32L65.73 179c-13.19-27-13-54 .77-76.71c22.09-36.47 74.6-56.44 141.31-54.06c2.39 66.66-17.59 119.18-54.06 141.27"/></svg>

React

import type { SVGProps } from "react";

export function PhLeaf(props: SVGProps<SVGSVGElement>) {
  return (
    <svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 256"><path fill="currentColor" d="M223.45 40.07a8 8 0 0 0-7.52-7.52C139.8 28.08 78.82 51 52.82 94a87.1 87.1 0 0 0-12.76 49c.57 15.92 5.21 32 13.79 47.85l-19.51 19.5a8 8 0 0 0 11.32 11.32l19.5-19.51C81 210.73 97.09 215.37 113 215.94q1.67.06 3.33.06A86.93 86.93 0 0 0 162 203.18c43-26 65.93-86.97 61.45-163.11m-69.7 149.43c-22.75 13.78-49.68 14-76.71.77l88.63-88.62a8 8 0 0 0-11.32-11.32L65.73 179c-13.19-27-13-54 .77-76.71c22.09-36.47 74.6-56.44 141.31-54.06c2.39 66.66-17.59 119.18-54.06 141.27"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 256"><path fill="currentColor" d="M223.45 40.07a8 8 0 0 0-7.52-7.52C139.8 28.08 78.82 51 52.82 94a87.1 87.1 0 0 0-12.76 49c.57 15.92 5.21 32 13.79 47.85l-19.51 19.5a8 8 0 0 0 11.32 11.32l19.5-19.51C81 210.73 97.09 215.37 113 215.94q1.67.06 3.33.06A86.93 86.93 0 0 0 162 203.18c43-26 65.93-86.97 61.45-163.11m-69.7 149.43c-22.75 13.78-49.68 14-76.71.77l88.63-88.62a8 8 0 0 0-11.32-11.32L65.73 179c-13.19-27-13-54 .77-76.71c22.09-36.47 74.6-56.44 141.31-54.06c2.39 66.66-17.59 119.18-54.06 141.27"/></svg>
</template>

CSS

.icon-leaf {
  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%20256%20256%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M223.45%2040.07a8%208%200%200%200-7.52-7.52C139.8%2028.08%2078.82%2051%2052.82%2094a87.1%2087.1%200%200%200-12.76%2049c.57%2015.92%205.21%2032%2013.79%2047.85l-19.51%2019.5a8%208%200%200%200%2011.32%2011.32l19.5-19.51C81%20210.73%2097.09%20215.37%20113%20215.94q1.67.06%203.33.06A86.93%2086.93%200%200%200%20162%20203.18c43-26%2065.93-86.97%2061.45-163.11m-69.7%20149.43c-22.75%2013.78-49.68%2014-76.71.77l88.63-88.62a8%208%200%200%200-11.32-11.32L65.73%20179c-13.19-27-13-54%20.77-76.71c22.09-36.47%2074.6-56.44%20141.31-54.06c2.39%2066.66-17.59%20119.18-54.06%20141.27%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%20256%20256%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M223.45%2040.07a8%208%200%200%200-7.52-7.52C139.8%2028.08%2078.82%2051%2052.82%2094a87.1%2087.1%200%200%200-12.76%2049c.57%2015.92%205.21%2032%2013.79%2047.85l-19.51%2019.5a8%208%200%200%200%2011.32%2011.32l19.5-19.51C81%20210.73%2097.09%20215.37%20113%20215.94q1.67.06%203.33.06A86.93%2086.93%200%200%200%20162%20203.18c43-26%2065.93-86.97%2061.45-163.11m-69.7%20149.43c-22.75%2013.78-49.68%2014-76.71.77l88.63-88.62a8%208%200%200%200-11.32-11.32L65.73%20179c-13.19-27-13-54%20.77-76.71c22.09-36.47%2074.6-56.44%20141.31-54.06c2.39%2066.66-17.59%20119.18-54.06%20141.27%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

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