geometric shapes 01 icon

geometric-shapes-01 from Huge Icons by Hugeicons · Stroke · MIT Free for personal and commercial use.

Name
geometric-shapes-01
Set
Huge Icons
Style
Stroke
Viewbox
24×24
License
MIT

Related icons in Huge Icons

geometric-shapes-02

Use the geometric shapes 01 icon

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><g fill="none" stroke="currentColor" stroke-linejoin="round" stroke-width="1.5"><path d="M14.617 4.767c1.01-1.601 1.516-2.401 2.178-2.643a2.06 2.06 0 0 1 1.41 0c.662.242 1.168 1.042 2.178 2.643c1.137 1.801 1.706 2.702 1.606 3.445c-.069.51-.326.976-.72 1.306C20.695 10 19.63 10 17.5 10s-3.195 0-3.77-.482a2.06 2.06 0 0 1-.719-1.306c-.1-.743.469-1.644 1.606-3.445ZM2 6c0-1.667 0-2.5.424-3.084q.207-.285.492-.492C3.5 2 4.333 2 6 2s2.5 0 3.084.424q.285.207.492.492C10 3.5 10 4.333 10 6s0 2.5-.424 3.084a2.2 2.2 0 0 1-.492.492C8.5 10 7.667 10 6 10s-2.5 0-3.084-.424a2.2 2.2 0 0 1-.492-.492C2 8.5 2 7.667 2 6Z"/><circle cx="17.5" cy="18" r="4"/><path stroke-linecap="round" d="m9.5 14.5l-7 7m0-7l7 7"/></g></svg>

React

import type { SVGProps } from "react";

export function HugeiconsGeometricShapes01(props: SVGProps<SVGSVGElement>) {
  return (
    <svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><g fill="none" stroke="currentColor" strokeLinejoin="round" strokeWidth="1.5"><path d="M14.617 4.767c1.01-1.601 1.516-2.401 2.178-2.643a2.06 2.06 0 0 1 1.41 0c.662.242 1.168 1.042 2.178 2.643c1.137 1.801 1.706 2.702 1.606 3.445c-.069.51-.326.976-.72 1.306C20.695 10 19.63 10 17.5 10s-3.195 0-3.77-.482a2.06 2.06 0 0 1-.719-1.306c-.1-.743.469-1.644 1.606-3.445ZM2 6c0-1.667 0-2.5.424-3.084q.207-.285.492-.492C3.5 2 4.333 2 6 2s2.5 0 3.084.424q.285.207.492.492C10 3.5 10 4.333 10 6s0 2.5-.424 3.084a2.2 2.2 0 0 1-.492.492C8.5 10 7.667 10 6 10s-2.5 0-3.084-.424a2.2 2.2 0 0 1-.492-.492C2 8.5 2 7.667 2 6Z"/><circle cx="17.5" cy="18" r="4"/><path strokeLinecap="round" d="m9.5 14.5l-7 7m0-7l7 7"/></g></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><g fill="none" stroke="currentColor" stroke-linejoin="round" stroke-width="1.5"><path d="M14.617 4.767c1.01-1.601 1.516-2.401 2.178-2.643a2.06 2.06 0 0 1 1.41 0c.662.242 1.168 1.042 2.178 2.643c1.137 1.801 1.706 2.702 1.606 3.445c-.069.51-.326.976-.72 1.306C20.695 10 19.63 10 17.5 10s-3.195 0-3.77-.482a2.06 2.06 0 0 1-.719-1.306c-.1-.743.469-1.644 1.606-3.445ZM2 6c0-1.667 0-2.5.424-3.084q.207-.285.492-.492C3.5 2 4.333 2 6 2s2.5 0 3.084.424q.285.207.492.492C10 3.5 10 4.333 10 6s0 2.5-.424 3.084a2.2 2.2 0 0 1-.492.492C8.5 10 7.667 10 6 10s-2.5 0-3.084-.424a2.2 2.2 0 0 1-.492-.492C2 8.5 2 7.667 2 6Z"/><circle cx="17.5" cy="18" r="4"/><path stroke-linecap="round" d="m9.5 14.5l-7 7m0-7l7 7"/></g></svg>
</template>

CSS

.icon-geometric-shapes-01 {
  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%3Cg%20fill%3D%22none%22%20stroke%3D%22currentColor%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.5%22%3E%3Cpath%20d%3D%22M14.617%204.767c1.01-1.601%201.516-2.401%202.178-2.643a2.06%202.06%200%200%201%201.41%200c.662.242%201.168%201.042%202.178%202.643c1.137%201.801%201.706%202.702%201.606%203.445c-.069.51-.326.976-.72%201.306C20.695%2010%2019.63%2010%2017.5%2010s-3.195%200-3.77-.482a2.06%202.06%200%200%201-.719-1.306c-.1-.743.469-1.644%201.606-3.445ZM2%206c0-1.667%200-2.5.424-3.084q.207-.285.492-.492C3.5%202%204.333%202%206%202s2.5%200%203.084.424q.285.207.492.492C10%203.5%2010%204.333%2010%206s0%202.5-.424%203.084a2.2%202.2%200%200%201-.492.492C8.5%2010%207.667%2010%206%2010s-2.5%200-3.084-.424a2.2%202.2%200%200%201-.492-.492C2%208.5%202%207.667%202%206Z%22%2F%3E%3Ccircle%20cx%3D%2217.5%22%20cy%3D%2218%22%20r%3D%224%22%2F%3E%3Cpath%20stroke-linecap%3D%22round%22%20d%3D%22m9.5%2014.5l-7%207m0-7l7%207%22%2F%3E%3C%2Fg%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%3Cg%20fill%3D%22none%22%20stroke%3D%22currentColor%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.5%22%3E%3Cpath%20d%3D%22M14.617%204.767c1.01-1.601%201.516-2.401%202.178-2.643a2.06%202.06%200%200%201%201.41%200c.662.242%201.168%201.042%202.178%202.643c1.137%201.801%201.706%202.702%201.606%203.445c-.069.51-.326.976-.72%201.306C20.695%2010%2019.63%2010%2017.5%2010s-3.195%200-3.77-.482a2.06%202.06%200%200%201-.719-1.306c-.1-.743.469-1.644%201.606-3.445ZM2%206c0-1.667%200-2.5.424-3.084q.207-.285.492-.492C3.5%202%204.333%202%206%202s2.5%200%203.084.424q.285.207.492.492C10%203.5%2010%204.333%2010%206s0%202.5-.424%203.084a2.2%202.2%200%200%201-.492.492C8.5%2010%207.667%2010%206%2010s-2.5%200-3.084-.424a2.2%202.2%200%200%201-.492-.492C2%208.5%202%207.667%202%206Z%22%2F%3E%3Ccircle%20cx%3D%2217.5%22%20cy%3D%2218%22%20r%3D%224%22%2F%3E%3Cpath%20stroke-linecap%3D%22round%22%20d%3D%22m9.5%2014.5l-7%207m0-7l7%207%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/hugeicons/geometric-shapes-01.svg?color=%231a73e8&size=48

Geometric Shapes 01 stroke icon — Huge Icons · IconsDB