heron logo

heron from SVG Logos by Gil Barbara · Color · CC0-1.0 Free for personal and commercial use.

Name
heron
Set
SVG Logos
Style
Color
Viewbox
256×256
License
CC0

Use the heron logo

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 256"><path d="M201.195 23.019V59.19c16.91 17.982 27.292 42.177 27.292 68.809c0 55.497-44.99 100.487-100.487 100.487a100.32 100.32 0 0 1-28.63-4.146c-.146-.044-.01-81.483-.01-81.483l57.538.18v65.223c10.734-3.265 21.253-10.142 31.615-19.658V112.69h-89.1s.085-64.966-.043-64.937c-17.388 3.88-32.426 19.535-32.426 19.535v173.237C85.092 250.394 105.89 256 128 256c70.693 0 128-57.307 128-128c0-43.465-21.684-81.845-54.805-104.981" fill="#048991"/><path d="M27.514 128C27.514 72.503 72.503 27.514 128 27.514a100.34 100.34 0 0 1 28.838 4.206v68.288h31.969V15.344C170.717 5.559 150.009 0 128 0C57.308 0 0 57.308 0 128c0 43.356 21.577 81.65 54.557 104.805v-36.256C37.79 178.594 27.514 154.503 27.514 128" fill="#818285"/></svg>

React

import type { SVGProps } from "react";

export function LogosHeron(props: SVGProps<SVGSVGElement>) {
  return (
    <svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 256"><path d="M201.195 23.019V59.19c16.91 17.982 27.292 42.177 27.292 68.809c0 55.497-44.99 100.487-100.487 100.487a100.32 100.32 0 0 1-28.63-4.146c-.146-.044-.01-81.483-.01-81.483l57.538.18v65.223c10.734-3.265 21.253-10.142 31.615-19.658V112.69h-89.1s.085-64.966-.043-64.937c-17.388 3.88-32.426 19.535-32.426 19.535v173.237C85.092 250.394 105.89 256 128 256c70.693 0 128-57.307 128-128c0-43.465-21.684-81.845-54.805-104.981" fill="#048991"/><path d="M27.514 128C27.514 72.503 72.503 27.514 128 27.514a100.34 100.34 0 0 1 28.838 4.206v68.288h31.969V15.344C170.717 5.559 150.009 0 128 0C57.308 0 0 57.308 0 128c0 43.356 21.577 81.65 54.557 104.805v-36.256C37.79 178.594 27.514 154.503 27.514 128" fill="#818285"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 256"><path d="M201.195 23.019V59.19c16.91 17.982 27.292 42.177 27.292 68.809c0 55.497-44.99 100.487-100.487 100.487a100.32 100.32 0 0 1-28.63-4.146c-.146-.044-.01-81.483-.01-81.483l57.538.18v65.223c10.734-3.265 21.253-10.142 31.615-19.658V112.69h-89.1s.085-64.966-.043-64.937c-17.388 3.88-32.426 19.535-32.426 19.535v173.237C85.092 250.394 105.89 256 128 256c70.693 0 128-57.307 128-128c0-43.465-21.684-81.845-54.805-104.981" fill="#048991"/><path d="M27.514 128C27.514 72.503 72.503 27.514 128 27.514a100.34 100.34 0 0 1 28.838 4.206v68.288h31.969V15.344C170.717 5.559 150.009 0 128 0C57.308 0 0 57.308 0 128c0 43.356 21.577 81.65 54.557 104.805v-36.256C37.79 178.594 27.514 154.503 27.514 128" fill="#818285"/></svg>
</template>

CSS

.icon-heron {
  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%20d%3D%22M201.195%2023.019V59.19c16.91%2017.982%2027.292%2042.177%2027.292%2068.809c0%2055.497-44.99%20100.487-100.487%20100.487a100.32%20100.32%200%200%201-28.63-4.146c-.146-.044-.01-81.483-.01-81.483l57.538.18v65.223c10.734-3.265%2021.253-10.142%2031.615-19.658V112.69h-89.1s.085-64.966-.043-64.937c-17.388%203.88-32.426%2019.535-32.426%2019.535v173.237C85.092%20250.394%20105.89%20256%20128%20256c70.693%200%20128-57.307%20128-128c0-43.465-21.684-81.845-54.805-104.981%22%20fill%3D%22%23048991%22%2F%3E%3Cpath%20d%3D%22M27.514%20128C27.514%2072.503%2072.503%2027.514%20128%2027.514a100.34%20100.34%200%200%201%2028.838%204.206v68.288h31.969V15.344C170.717%205.559%20150.009%200%20128%200C57.308%200%200%2057.308%200%20128c0%2043.356%2021.577%2081.65%2054.557%20104.805v-36.256C37.79%20178.594%2027.514%20154.503%2027.514%20128%22%20fill%3D%22%23818285%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%20d%3D%22M201.195%2023.019V59.19c16.91%2017.982%2027.292%2042.177%2027.292%2068.809c0%2055.497-44.99%20100.487-100.487%20100.487a100.32%20100.32%200%200%201-28.63-4.146c-.146-.044-.01-81.483-.01-81.483l57.538.18v65.223c10.734-3.265%2021.253-10.142%2031.615-19.658V112.69h-89.1s.085-64.966-.043-64.937c-17.388%203.88-32.426%2019.535-32.426%2019.535v173.237C85.092%20250.394%20105.89%20256%20128%20256c70.693%200%20128-57.307%20128-128c0-43.465-21.684-81.845-54.805-104.981%22%20fill%3D%22%23048991%22%2F%3E%3Cpath%20d%3D%22M27.514%20128C27.514%2072.503%2072.503%2027.514%20128%2027.514a100.34%20100.34%200%200%201%2028.838%204.206v68.288h31.969V15.344C170.717%205.559%20150.009%200%20128%200C57.308%200%200%2057.308%200%20128c0%2043.356%2021.577%2081.65%2054.557%20104.805v-36.256C37.79%20178.594%2027.514%20154.503%2027.514%20128%22%20fill%3D%22%23818285%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

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