endpoint displacement icon
endpoint-displacement from IconPark by ByteDance · Color · Edit · Apache-2.0 Free for personal and commercial use.
- Name
- endpoint-displacement
- Set
- IconPark
- Style
- Color
- Category
- Edit
- Viewbox
- 48×48
- License
- Apache 2.0
The same icon in other sets
More edit icons from IconPark
Use the endpoint displacement icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 48 48"><g fill="none"><path fill="#2F88FF" d="M16 10C16 12.7614 13.7614 15 11 15C8.23858 15 6 12.7614 6 10C6 7.23858 8.23858 5 11 5C13.7614 5 16 7.23858 16 10Z"/><path stroke="#000" stroke-linecap="round" stroke-linejoin="round" stroke-width="4" d="M16 10C16 12.7614 13.7614 15 11 15C8.23858 15 6 12.7614 6 10C6 7.23858 8.23858 5 11 5C13.7614 5 16 7.23858 16 10ZM16 10H27M27 10L23 6M27 10L23 14"/><path fill="#2F88FF" d="M32 38C32 40.7614 34.2386 43 37 43C39.7614 43 42 40.7614 42 38C42 35.2386 39.7614 33 37 33C34.2386 33 32 35.2386 32 38Z"/><path stroke="#000" stroke-linecap="round" stroke-linejoin="round" stroke-width="4" d="M32 38C32 40.7614 34.2386 43 37 43C39.7614 43 42 40.7614 42 38C42 35.2386 39.7614 33 37 33C34.2386 33 32 35.2386 32 38ZM32 38H21M21 38L25 34M21 38L25 42"/><path fill="#2F88FF" d="M33 11C33 13.7614 35.2386 16 38 16C40.7614 16 43 13.7614 43 11C43 8.23858 40.7614 6 38 6C35.2386 6 33 8.23858 33 11Z"/><path stroke="#000" stroke-linecap="round" stroke-linejoin="round" stroke-width="4" d="M38 16C35.2386 16 33 13.7614 33 11C33 8.23858 35.2386 6 38 6C40.7614 6 43 8.23858 43 11C43 13.7614 40.7614 16 38 16ZM38 16V27M38 27L42 23M38 27L34 23"/><path fill="#2F88FF" d="M5 37C5 34.2386 7.23858 32 10 32C12.7614 32 15 34.2386 15 37C15 39.7614 12.7614 42 10 42C7.23858 42 5 39.7614 5 37Z"/><path stroke="#000" stroke-linecap="round" stroke-linejoin="round" stroke-width="4" d="M10 32C7.23858 32 5 34.2386 5 37C5 39.7614 7.23858 42 10 42C12.7614 42 15 39.7614 15 37C15 34.2386 12.7614 32 10 32ZM10 32V21M10 21L14 25M10 21L6 25"/></g></svg>
React
import type { SVGProps } from "react";
export function IconParkEndpointDisplacement(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 48 48"><g fill="none"><path fill="#2F88FF" d="M16 10C16 12.7614 13.7614 15 11 15C8.23858 15 6 12.7614 6 10C6 7.23858 8.23858 5 11 5C13.7614 5 16 7.23858 16 10Z"/><path stroke="#000" strokeLinecap="round" strokeLinejoin="round" strokeWidth="4" d="M16 10C16 12.7614 13.7614 15 11 15C8.23858 15 6 12.7614 6 10C6 7.23858 8.23858 5 11 5C13.7614 5 16 7.23858 16 10ZM16 10H27M27 10L23 6M27 10L23 14"/><path fill="#2F88FF" d="M32 38C32 40.7614 34.2386 43 37 43C39.7614 43 42 40.7614 42 38C42 35.2386 39.7614 33 37 33C34.2386 33 32 35.2386 32 38Z"/><path stroke="#000" strokeLinecap="round" strokeLinejoin="round" strokeWidth="4" d="M32 38C32 40.7614 34.2386 43 37 43C39.7614 43 42 40.7614 42 38C42 35.2386 39.7614 33 37 33C34.2386 33 32 35.2386 32 38ZM32 38H21M21 38L25 34M21 38L25 42"/><path fill="#2F88FF" d="M33 11C33 13.7614 35.2386 16 38 16C40.7614 16 43 13.7614 43 11C43 8.23858 40.7614 6 38 6C35.2386 6 33 8.23858 33 11Z"/><path stroke="#000" strokeLinecap="round" strokeLinejoin="round" strokeWidth="4" d="M38 16C35.2386 16 33 13.7614 33 11C33 8.23858 35.2386 6 38 6C40.7614 6 43 8.23858 43 11C43 13.7614 40.7614 16 38 16ZM38 16V27M38 27L42 23M38 27L34 23"/><path fill="#2F88FF" d="M5 37C5 34.2386 7.23858 32 10 32C12.7614 32 15 34.2386 15 37C15 39.7614 12.7614 42 10 42C7.23858 42 5 39.7614 5 37Z"/><path stroke="#000" strokeLinecap="round" strokeLinejoin="round" strokeWidth="4" d="M10 32C7.23858 32 5 34.2386 5 37C5 39.7614 7.23858 42 10 42C12.7614 42 15 39.7614 15 37C15 34.2386 12.7614 32 10 32ZM10 32V21M10 21L14 25M10 21L6 25"/></g></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 48 48"><g fill="none"><path fill="#2F88FF" d="M16 10C16 12.7614 13.7614 15 11 15C8.23858 15 6 12.7614 6 10C6 7.23858 8.23858 5 11 5C13.7614 5 16 7.23858 16 10Z"/><path stroke="#000" stroke-linecap="round" stroke-linejoin="round" stroke-width="4" d="M16 10C16 12.7614 13.7614 15 11 15C8.23858 15 6 12.7614 6 10C6 7.23858 8.23858 5 11 5C13.7614 5 16 7.23858 16 10ZM16 10H27M27 10L23 6M27 10L23 14"/><path fill="#2F88FF" d="M32 38C32 40.7614 34.2386 43 37 43C39.7614 43 42 40.7614 42 38C42 35.2386 39.7614 33 37 33C34.2386 33 32 35.2386 32 38Z"/><path stroke="#000" stroke-linecap="round" stroke-linejoin="round" stroke-width="4" d="M32 38C32 40.7614 34.2386 43 37 43C39.7614 43 42 40.7614 42 38C42 35.2386 39.7614 33 37 33C34.2386 33 32 35.2386 32 38ZM32 38H21M21 38L25 34M21 38L25 42"/><path fill="#2F88FF" d="M33 11C33 13.7614 35.2386 16 38 16C40.7614 16 43 13.7614 43 11C43 8.23858 40.7614 6 38 6C35.2386 6 33 8.23858 33 11Z"/><path stroke="#000" stroke-linecap="round" stroke-linejoin="round" stroke-width="4" d="M38 16C35.2386 16 33 13.7614 33 11C33 8.23858 35.2386 6 38 6C40.7614 6 43 8.23858 43 11C43 13.7614 40.7614 16 38 16ZM38 16V27M38 27L42 23M38 27L34 23"/><path fill="#2F88FF" d="M5 37C5 34.2386 7.23858 32 10 32C12.7614 32 15 34.2386 15 37C15 39.7614 12.7614 42 10 42C7.23858 42 5 39.7614 5 37Z"/><path stroke="#000" stroke-linecap="round" stroke-linejoin="round" stroke-width="4" d="M10 32C7.23858 32 5 34.2386 5 37C5 39.7614 7.23858 42 10 42C12.7614 42 15 39.7614 15 37C15 34.2386 12.7614 32 10 32ZM10 32V21M10 21L14 25M10 21L6 25"/></g></svg> </template>
CSS
.icon-endpoint-displacement {
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%2048%2048%22%3E%3Cg%20fill%3D%22none%22%3E%3Cpath%20fill%3D%22%232F88FF%22%20d%3D%22M16%2010C16%2012.7614%2013.7614%2015%2011%2015C8.23858%2015%206%2012.7614%206%2010C6%207.23858%208.23858%205%2011%205C13.7614%205%2016%207.23858%2016%2010Z%22%2F%3E%3Cpath%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%224%22%20d%3D%22M16%2010C16%2012.7614%2013.7614%2015%2011%2015C8.23858%2015%206%2012.7614%206%2010C6%207.23858%208.23858%205%2011%205C13.7614%205%2016%207.23858%2016%2010ZM16%2010H27M27%2010L23%206M27%2010L23%2014%22%2F%3E%3Cpath%20fill%3D%22%232F88FF%22%20d%3D%22M32%2038C32%2040.7614%2034.2386%2043%2037%2043C39.7614%2043%2042%2040.7614%2042%2038C42%2035.2386%2039.7614%2033%2037%2033C34.2386%2033%2032%2035.2386%2032%2038Z%22%2F%3E%3Cpath%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%224%22%20d%3D%22M32%2038C32%2040.7614%2034.2386%2043%2037%2043C39.7614%2043%2042%2040.7614%2042%2038C42%2035.2386%2039.7614%2033%2037%2033C34.2386%2033%2032%2035.2386%2032%2038ZM32%2038H21M21%2038L25%2034M21%2038L25%2042%22%2F%3E%3Cpath%20fill%3D%22%232F88FF%22%20d%3D%22M33%2011C33%2013.7614%2035.2386%2016%2038%2016C40.7614%2016%2043%2013.7614%2043%2011C43%208.23858%2040.7614%206%2038%206C35.2386%206%2033%208.23858%2033%2011Z%22%2F%3E%3Cpath%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%224%22%20d%3D%22M38%2016C35.2386%2016%2033%2013.7614%2033%2011C33%208.23858%2035.2386%206%2038%206C40.7614%206%2043%208.23858%2043%2011C43%2013.7614%2040.7614%2016%2038%2016ZM38%2016V27M38%2027L42%2023M38%2027L34%2023%22%2F%3E%3Cpath%20fill%3D%22%232F88FF%22%20d%3D%22M5%2037C5%2034.2386%207.23858%2032%2010%2032C12.7614%2032%2015%2034.2386%2015%2037C15%2039.7614%2012.7614%2042%2010%2042C7.23858%2042%205%2039.7614%205%2037Z%22%2F%3E%3Cpath%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%224%22%20d%3D%22M10%2032C7.23858%2032%205%2034.2386%205%2037C5%2039.7614%207.23858%2042%2010%2042C12.7614%2042%2015%2039.7614%2015%2037C15%2034.2386%2012.7614%2032%2010%2032ZM10%2032V21M10%2021L14%2025M10%2021L6%2025%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%2048%2048%22%3E%3Cg%20fill%3D%22none%22%3E%3Cpath%20fill%3D%22%232F88FF%22%20d%3D%22M16%2010C16%2012.7614%2013.7614%2015%2011%2015C8.23858%2015%206%2012.7614%206%2010C6%207.23858%208.23858%205%2011%205C13.7614%205%2016%207.23858%2016%2010Z%22%2F%3E%3Cpath%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%224%22%20d%3D%22M16%2010C16%2012.7614%2013.7614%2015%2011%2015C8.23858%2015%206%2012.7614%206%2010C6%207.23858%208.23858%205%2011%205C13.7614%205%2016%207.23858%2016%2010ZM16%2010H27M27%2010L23%206M27%2010L23%2014%22%2F%3E%3Cpath%20fill%3D%22%232F88FF%22%20d%3D%22M32%2038C32%2040.7614%2034.2386%2043%2037%2043C39.7614%2043%2042%2040.7614%2042%2038C42%2035.2386%2039.7614%2033%2037%2033C34.2386%2033%2032%2035.2386%2032%2038Z%22%2F%3E%3Cpath%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%224%22%20d%3D%22M32%2038C32%2040.7614%2034.2386%2043%2037%2043C39.7614%2043%2042%2040.7614%2042%2038C42%2035.2386%2039.7614%2033%2037%2033C34.2386%2033%2032%2035.2386%2032%2038ZM32%2038H21M21%2038L25%2034M21%2038L25%2042%22%2F%3E%3Cpath%20fill%3D%22%232F88FF%22%20d%3D%22M33%2011C33%2013.7614%2035.2386%2016%2038%2016C40.7614%2016%2043%2013.7614%2043%2011C43%208.23858%2040.7614%206%2038%206C35.2386%206%2033%208.23858%2033%2011Z%22%2F%3E%3Cpath%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%224%22%20d%3D%22M38%2016C35.2386%2016%2033%2013.7614%2033%2011C33%208.23858%2035.2386%206%2038%206C40.7614%206%2043%208.23858%2043%2011C43%2013.7614%2040.7614%2016%2038%2016ZM38%2016V27M38%2027L42%2023M38%2027L34%2023%22%2F%3E%3Cpath%20fill%3D%22%232F88FF%22%20d%3D%22M5%2037C5%2034.2386%207.23858%2032%2010%2032C12.7614%2032%2015%2034.2386%2015%2037C15%2039.7614%2012.7614%2042%2010%2042C7.23858%2042%205%2039.7614%205%2037Z%22%2F%3E%3Cpath%20stroke%3D%22%23000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%224%22%20d%3D%22M10%2032C7.23858%2032%205%2034.2386%205%2037C5%2039.7614%207.23858%2042%2010%2042C12.7614%2042%2015%2039.7614%2015%2037C15%2034.2386%2012.7614%2032%2010%2032ZM10%2032V21M10%2021L14%2025M10%2021L6%2025%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/icon-park/endpoint-displacement.svg?color=%231a73e8&size=48
