vector curve icon

vector-curve from Material Design Icons by Pictogrammers · Filled · Geographic Information System · Apache-2.0 Free for personal and commercial use.

Name: vector-curve
Set: Material Design Icons
Style: Filled
Category: Geographic Information System
Viewbox: 24×24
License: Apache 2.0
Aliases: bezier

More geographic information system icons from Material Design Icons

Use the vector curve icon

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M18.5 2A1.5 1.5 0 0 1 20 3.5A1.5 1.5 0 0 1 18.5 5c-.23 0-.45-.05-.65-.15l-3.69 3.7l.34.45c2.19-1.26 4.76-2 7.5-2l1 .03v2.01L22 9c-2.58 0-5 .75-7 2.04A3.96 3.96 0 0 1 11.04 15C9.75 17 9 19.42 9 22l.04 1H7.03L7 22c0-2.74.74-5.31 2-7.5l-.45-.34l-3.7 3.69c.1.2.15.42.15.65A1.5 1.5 0 0 1 3.5 20A1.5 1.5 0 0 1 2 18.5A1.5 1.5 0 0 1 3.5 17c.23 0 .45.05.65.15l3.69-3.7C7.31 12.78 7 11.92 7 11a4 4 0 0 1 4-4c.92 0 1.78.31 2.45.84l3.7-3.69c-.1-.2-.15-.42-.15-.65A1.5 1.5 0 0 1 18.5 2M11 9a2 2 0 0 0-2 2a2 2 0 0 0 2 2a2 2 0 0 0 2-2a2 2 0 0 0-2-2"/></svg>

React

import type { SVGProps } from "react";

export function MdiVectorCurve(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="M18.5 2A1.5 1.5 0 0 1 20 3.5A1.5 1.5 0 0 1 18.5 5c-.23 0-.45-.05-.65-.15l-3.69 3.7l.34.45c2.19-1.26 4.76-2 7.5-2l1 .03v2.01L22 9c-2.58 0-5 .75-7 2.04A3.96 3.96 0 0 1 11.04 15C9.75 17 9 19.42 9 22l.04 1H7.03L7 22c0-2.74.74-5.31 2-7.5l-.45-.34l-3.7 3.69c.1.2.15.42.15.65A1.5 1.5 0 0 1 3.5 20A1.5 1.5 0 0 1 2 18.5A1.5 1.5 0 0 1 3.5 17c.23 0 .45.05.65.15l3.69-3.7C7.31 12.78 7 11.92 7 11a4 4 0 0 1 4-4c.92 0 1.78.31 2.45.84l3.7-3.69c-.1-.2-.15-.42-.15-.65A1.5 1.5 0 0 1 18.5 2M11 9a2 2 0 0 0-2 2a2 2 0 0 0 2 2a2 2 0 0 0 2-2a2 2 0 0 0-2-2"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M18.5 2A1.5 1.5 0 0 1 20 3.5A1.5 1.5 0 0 1 18.5 5c-.23 0-.45-.05-.65-.15l-3.69 3.7l.34.45c2.19-1.26 4.76-2 7.5-2l1 .03v2.01L22 9c-2.58 0-5 .75-7 2.04A3.96 3.96 0 0 1 11.04 15C9.75 17 9 19.42 9 22l.04 1H7.03L7 22c0-2.74.74-5.31 2-7.5l-.45-.34l-3.7 3.69c.1.2.15.42.15.65A1.5 1.5 0 0 1 3.5 20A1.5 1.5 0 0 1 2 18.5A1.5 1.5 0 0 1 3.5 17c.23 0 .45.05.65.15l3.69-3.7C7.31 12.78 7 11.92 7 11a4 4 0 0 1 4-4c.92 0 1.78.31 2.45.84l3.7-3.69c-.1-.2-.15-.42-.15-.65A1.5 1.5 0 0 1 18.5 2M11 9a2 2 0 0 0-2 2a2 2 0 0 0 2 2a2 2 0 0 0 2-2a2 2 0 0 0-2-2"/></svg>
</template>

CSS

.icon-vector-curve {
  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%22M18.5%202A1.5%201.5%200%200%201%2020%203.5A1.5%201.5%200%200%201%2018.5%205c-.23%200-.45-.05-.65-.15l-3.69%203.7l.34.45c2.19-1.26%204.76-2%207.5-2l1%20.03v2.01L22%209c-2.58%200-5%20.75-7%202.04A3.96%203.96%200%200%201%2011.04%2015C9.75%2017%209%2019.42%209%2022l.04%201H7.03L7%2022c0-2.74.74-5.31%202-7.5l-.45-.34l-3.7%203.69c.1.2.15.42.15.65A1.5%201.5%200%200%201%203.5%2020A1.5%201.5%200%200%201%202%2018.5A1.5%201.5%200%200%201%203.5%2017c.23%200%20.45.05.65.15l3.69-3.7C7.31%2012.78%207%2011.92%207%2011a4%204%200%200%201%204-4c.92%200%201.78.31%202.45.84l3.7-3.69c-.1-.2-.15-.42-.15-.65A1.5%201.5%200%200%201%2018.5%202M11%209a2%202%200%200%200-2%202a2%202%200%200%200%202%202a2%202%200%200%200%202-2a2%202%200%200%200-2-2%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%22M18.5%202A1.5%201.5%200%200%201%2020%203.5A1.5%201.5%200%200%201%2018.5%205c-.23%200-.45-.05-.65-.15l-3.69%203.7l.34.45c2.19-1.26%204.76-2%207.5-2l1%20.03v2.01L22%209c-2.58%200-5%20.75-7%202.04A3.96%203.96%200%200%201%2011.04%2015C9.75%2017%209%2019.42%209%2022l.04%201H7.03L7%2022c0-2.74.74-5.31%202-7.5l-.45-.34l-3.7%203.69c.1.2.15.42.15.65A1.5%201.5%200%200%201%203.5%2020A1.5%201.5%200%200%201%202%2018.5A1.5%201.5%200%200%201%203.5%2017c.23%200%20.45.05.65.15l3.69-3.7C7.31%2012.78%207%2011.92%207%2011a4%204%200%200%201%204-4c.92%200%201.78.31%202.45.84l3.7-3.69c-.1-.2-.15-.42-.15-.65A1.5%201.5%200%200%201%2018.5%202M11%209a2%202%200%200%200-2%202a2%202%200%200%200%202%202a2%202%200%200%200%202-2a2%202%200%200%200-2-2%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

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