maple-leaf-fill from MingCute Icon by MingCute Design · Fill · Apache-2.0 Free for personal and commercial use.

Name
maple-leaf-fill
Set
MingCute Icon
Style
Fill
Viewbox
24×24
License
Apache 2.0

1 other variant in MingCute Icon

The same icon in other sets

Use the maple leaf icon

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M11.553 3.106a1 1 0 0 1 .894 0c.71.354 1.58 1.18 2.267 2.237c.42.647.797 1.42 1.033 2.289c.722-.448 1.507-.77 2.437-1.08a1 1 0 0 1 1.297.752c.256 1.284.412 2.558.192 3.807a6.2 6.2 0 0 1-.834 2.184a7.5 7.5 0 0 1 1.716.873a1 1 0 0 1 .374 1.203c-.29.724-1.022 1.504-2.37 2.154c-1.216.588-2.99 1.098-5.564 1.382Q13 18.953 13 19v2a1 1 0 1 1-2 0v-2q0-.047.004-.093c-2.573-.284-4.347-.794-5.563-1.382c-1.348-.65-2.08-1.43-2.37-2.154a1 1 0 0 1 .374-1.203a7.5 7.5 0 0 1 1.716-.873a6.1 6.1 0 0 1-.833-2.184c-.22-1.25-.065-2.523.192-3.807a1 1 0 0 1 1.297-.752c.93.31 1.714.632 2.436 1.08a8.2 8.2 0 0 1 1.033-2.29c.686-1.056 1.558-1.882 2.267-2.236M12 13a1 1 0 0 0-1 1v2.895q.475.056 1 .101q.525-.045 1-.101V14a1 1 0 0 0-1-1"/></svg>

React

import type { SVGProps } from "react";

export function MingcuteMapleLeafFill(props: SVGProps<SVGSVGElement>) {
  return (
    <svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M11.553 3.106a1 1 0 0 1 .894 0c.71.354 1.58 1.18 2.267 2.237c.42.647.797 1.42 1.033 2.289c.722-.448 1.507-.77 2.437-1.08a1 1 0 0 1 1.297.752c.256 1.284.412 2.558.192 3.807a6.2 6.2 0 0 1-.834 2.184a7.5 7.5 0 0 1 1.716.873a1 1 0 0 1 .374 1.203c-.29.724-1.022 1.504-2.37 2.154c-1.216.588-2.99 1.098-5.564 1.382Q13 18.953 13 19v2a1 1 0 1 1-2 0v-2q0-.047.004-.093c-2.573-.284-4.347-.794-5.563-1.382c-1.348-.65-2.08-1.43-2.37-2.154a1 1 0 0 1 .374-1.203a7.5 7.5 0 0 1 1.716-.873a6.1 6.1 0 0 1-.833-2.184c-.22-1.25-.065-2.523.192-3.807a1 1 0 0 1 1.297-.752c.93.31 1.714.632 2.436 1.08a8.2 8.2 0 0 1 1.033-2.29c.686-1.056 1.558-1.882 2.267-2.236M12 13a1 1 0 0 0-1 1v2.895q.475.056 1 .101q.525-.045 1-.101V14a1 1 0 0 0-1-1"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M11.553 3.106a1 1 0 0 1 .894 0c.71.354 1.58 1.18 2.267 2.237c.42.647.797 1.42 1.033 2.289c.722-.448 1.507-.77 2.437-1.08a1 1 0 0 1 1.297.752c.256 1.284.412 2.558.192 3.807a6.2 6.2 0 0 1-.834 2.184a7.5 7.5 0 0 1 1.716.873a1 1 0 0 1 .374 1.203c-.29.724-1.022 1.504-2.37 2.154c-1.216.588-2.99 1.098-5.564 1.382Q13 18.953 13 19v2a1 1 0 1 1-2 0v-2q0-.047.004-.093c-2.573-.284-4.347-.794-5.563-1.382c-1.348-.65-2.08-1.43-2.37-2.154a1 1 0 0 1 .374-1.203a7.5 7.5 0 0 1 1.716-.873a6.1 6.1 0 0 1-.833-2.184c-.22-1.25-.065-2.523.192-3.807a1 1 0 0 1 1.297-.752c.93.31 1.714.632 2.436 1.08a8.2 8.2 0 0 1 1.033-2.29c.686-1.056 1.558-1.882 2.267-2.236M12 13a1 1 0 0 0-1 1v2.895q.475.056 1 .101q.525-.045 1-.101V14a1 1 0 0 0-1-1"/></svg>
</template>

CSS

.icon-maple-leaf-fill {
  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%2024%2024%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M11.553%203.106a1%201%200%200%201%20.894%200c.71.354%201.58%201.18%202.267%202.237c.42.647.797%201.42%201.033%202.289c.722-.448%201.507-.77%202.437-1.08a1%201%200%200%201%201.297.752c.256%201.284.412%202.558.192%203.807a6.2%206.2%200%200%201-.834%202.184a7.5%207.5%200%200%201%201.716.873a1%201%200%200%201%20.374%201.203c-.29.724-1.022%201.504-2.37%202.154c-1.216.588-2.99%201.098-5.564%201.382Q13%2018.953%2013%2019v2a1%201%200%201%201-2%200v-2q0-.047.004-.093c-2.573-.284-4.347-.794-5.563-1.382c-1.348-.65-2.08-1.43-2.37-2.154a1%201%200%200%201%20.374-1.203a7.5%207.5%200%200%201%201.716-.873a6.1%206.1%200%200%201-.833-2.184c-.22-1.25-.065-2.523.192-3.807a1%201%200%200%201%201.297-.752c.93.31%201.714.632%202.436%201.08a8.2%208.2%200%200%201%201.033-2.29c.686-1.056%201.558-1.882%202.267-2.236M12%2013a1%201%200%200%200-1%201v2.895q.475.056%201%20.101q.525-.045%201-.101V14a1%201%200%200%200-1-1%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%2024%2024%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M11.553%203.106a1%201%200%200%201%20.894%200c.71.354%201.58%201.18%202.267%202.237c.42.647.797%201.42%201.033%202.289c.722-.448%201.507-.77%202.437-1.08a1%201%200%200%201%201.297.752c.256%201.284.412%202.558.192%203.807a6.2%206.2%200%200%201-.834%202.184a7.5%207.5%200%200%201%201.716.873a1%201%200%200%201%20.374%201.203c-.29.724-1.022%201.504-2.37%202.154c-1.216.588-2.99%201.098-5.564%201.382Q13%2018.953%2013%2019v2a1%201%200%201%201-2%200v-2q0-.047.004-.093c-2.573-.284-4.347-.794-5.563-1.382c-1.348-.65-2.08-1.43-2.37-2.154a1%201%200%200%201%20.374-1.203a7.5%207.5%200%200%201%201.716-.873a6.1%206.1%200%200%201-.833-2.184c-.22-1.25-.065-2.523.192-3.807a1%201%200%200%201%201.297-.752c.93.31%201.714.632%202.436%201.08a8.2%208.2%200%200%201%201.033-2.29c.686-1.056%201.558-1.882%202.267-2.236M12%2013a1%201%200%200%200-1%201v2.895q.475.056%201%20.101q.525-.045%201-.101V14a1%201%200%200%200-1-1%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

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