hop off icon
hop-off from Lucide by Lucide Contributors · Outline · ISC Free for personal and commercial use.
- Name
- hop-off
- Set
- Lucide
- Style
- Outline
- Viewbox
- 24×24
- License
- ISC
The same icon in other sets
Use the hop off 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-linecap="round" stroke-linejoin="round" stroke-width="2"><path d="M10.82 16.12c1.69.6 3.91.79 5.18.85c.28.01.53-.09.7-.27"/><path d="M11.14 20.57c.52.24 2.44 1.12 4.08 1.37c.46.06.86-.25.9-.71c.12-1.52-.3-3.43-.5-4.28"/><path d="M16.13 21.05c1.65.63 3.68.84 4.87.91a.9.9 0 0 0 .7-.26M17.99 5.52a20.8 20.8 0 0 1 3.15 4.5a.8.8 0 0 1-.68 1.13c-1.17.1-2.5.02-3.9-.25"/><path d="M20.57 11.14c.24.52 1.12 2.44 1.37 4.08c.04.3-.08.59-.31.75M4.93 4.93a10 10 0 0 0-.67 13.4c.35.43.96.4 1.17-.12c.69-1.71 1.07-5.07 1.07-6.71c1.34.45 3.1.9 4.88.62a.85.85 0 0 0 .48-.24"/><path d="M5.52 17.99c1.05.95 2.91 2.42 4.5 3.15a.8.8 0 0 0 1.13-.68c.2-2.34-.33-5.3-1.57-8.28m-1.23-9.5a10 10 0 0 1 9.98 1.58c.43.35.4.96-.12 1.17c-1.5.6-4.3.98-6.07 1.05M2 2l20 20"/></g></svg>
React
import type { SVGProps } from "react";
export function LucideHopOff(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" strokeLinecap="round" strokeLinejoin="round" strokeWidth="2"><path d="M10.82 16.12c1.69.6 3.91.79 5.18.85c.28.01.53-.09.7-.27"/><path d="M11.14 20.57c.52.24 2.44 1.12 4.08 1.37c.46.06.86-.25.9-.71c.12-1.52-.3-3.43-.5-4.28"/><path d="M16.13 21.05c1.65.63 3.68.84 4.87.91a.9.9 0 0 0 .7-.26M17.99 5.52a20.8 20.8 0 0 1 3.15 4.5a.8.8 0 0 1-.68 1.13c-1.17.1-2.5.02-3.9-.25"/><path d="M20.57 11.14c.24.52 1.12 2.44 1.37 4.08c.04.3-.08.59-.31.75M4.93 4.93a10 10 0 0 0-.67 13.4c.35.43.96.4 1.17-.12c.69-1.71 1.07-5.07 1.07-6.71c1.34.45 3.1.9 4.88.62a.85.85 0 0 0 .48-.24"/><path d="M5.52 17.99c1.05.95 2.91 2.42 4.5 3.15a.8.8 0 0 0 1.13-.68c.2-2.34-.33-5.3-1.57-8.28m-1.23-9.5a10 10 0 0 1 9.98 1.58c.43.35.4.96-.12 1.17c-1.5.6-4.3.98-6.07 1.05M2 2l20 20"/></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-linecap="round" stroke-linejoin="round" stroke-width="2"><path d="M10.82 16.12c1.69.6 3.91.79 5.18.85c.28.01.53-.09.7-.27"/><path d="M11.14 20.57c.52.24 2.44 1.12 4.08 1.37c.46.06.86-.25.9-.71c.12-1.52-.3-3.43-.5-4.28"/><path d="M16.13 21.05c1.65.63 3.68.84 4.87.91a.9.9 0 0 0 .7-.26M17.99 5.52a20.8 20.8 0 0 1 3.15 4.5a.8.8 0 0 1-.68 1.13c-1.17.1-2.5.02-3.9-.25"/><path d="M20.57 11.14c.24.52 1.12 2.44 1.37 4.08c.04.3-.08.59-.31.75M4.93 4.93a10 10 0 0 0-.67 13.4c.35.43.96.4 1.17-.12c.69-1.71 1.07-5.07 1.07-6.71c1.34.45 3.1.9 4.88.62a.85.85 0 0 0 .48-.24"/><path d="M5.52 17.99c1.05.95 2.91 2.42 4.5 3.15a.8.8 0 0 0 1.13-.68c.2-2.34-.33-5.3-1.57-8.28m-1.23-9.5a10 10 0 0 1 9.98 1.58c.43.35.4.96-.12 1.17c-1.5.6-4.3.98-6.07 1.05M2 2l20 20"/></g></svg> </template>
CSS
.icon-hop-off {
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-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%222%22%3E%3Cpath%20d%3D%22M10.82%2016.12c1.69.6%203.91.79%205.18.85c.28.01.53-.09.7-.27%22%2F%3E%3Cpath%20d%3D%22M11.14%2020.57c.52.24%202.44%201.12%204.08%201.37c.46.06.86-.25.9-.71c.12-1.52-.3-3.43-.5-4.28%22%2F%3E%3Cpath%20d%3D%22M16.13%2021.05c1.65.63%203.68.84%204.87.91a.9.9%200%200%200%20.7-.26M17.99%205.52a20.8%2020.8%200%200%201%203.15%204.5a.8.8%200%200%201-.68%201.13c-1.17.1-2.5.02-3.9-.25%22%2F%3E%3Cpath%20d%3D%22M20.57%2011.14c.24.52%201.12%202.44%201.37%204.08c.04.3-.08.59-.31.75M4.93%204.93a10%2010%200%200%200-.67%2013.4c.35.43.96.4%201.17-.12c.69-1.71%201.07-5.07%201.07-6.71c1.34.45%203.1.9%204.88.62a.85.85%200%200%200%20.48-.24%22%2F%3E%3Cpath%20d%3D%22M5.52%2017.99c1.05.95%202.91%202.42%204.5%203.15a.8.8%200%200%200%201.13-.68c.2-2.34-.33-5.3-1.57-8.28m-1.23-9.5a10%2010%200%200%201%209.98%201.58c.43.35.4.96-.12%201.17c-1.5.6-4.3.98-6.07%201.05M2%202l20%2020%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-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%222%22%3E%3Cpath%20d%3D%22M10.82%2016.12c1.69.6%203.91.79%205.18.85c.28.01.53-.09.7-.27%22%2F%3E%3Cpath%20d%3D%22M11.14%2020.57c.52.24%202.44%201.12%204.08%201.37c.46.06.86-.25.9-.71c.12-1.52-.3-3.43-.5-4.28%22%2F%3E%3Cpath%20d%3D%22M16.13%2021.05c1.65.63%203.68.84%204.87.91a.9.9%200%200%200%20.7-.26M17.99%205.52a20.8%2020.8%200%200%201%203.15%204.5a.8.8%200%200%201-.68%201.13c-1.17.1-2.5.02-3.9-.25%22%2F%3E%3Cpath%20d%3D%22M20.57%2011.14c.24.52%201.12%202.44%201.37%204.08c.04.3-.08.59-.31.75M4.93%204.93a10%2010%200%200%200-.67%2013.4c.35.43.96.4%201.17-.12c.69-1.71%201.07-5.07%201.07-6.71c1.34.45%203.1.9%204.88.62a.85.85%200%200%200%20.48-.24%22%2F%3E%3Cpath%20d%3D%22M5.52%2017.99c1.05.95%202.91%202.42%204.5%203.15a.8.8%200%200%200%201.13-.68c.2-2.34-.33-5.3-1.57-8.28m-1.23-9.5a10%2010%200%200%201%209.98%201.58c.43.35.4.96-.12%201.17c-1.5.6-4.3.98-6.07%201.05M2%202l20%2020%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/lucide/hop-off.svg?color=%231a73e8&size=48
