hop icon
hop from Lucide by Lucide Contributors · Outline · ISC Free for personal and commercial use.
- Name
- hop
- Set
- Lucide
- Style
- Outline
- Viewbox
- 24×24
- License
- ISC
The same icon in other sets
Related icons in Lucide
Use the hop 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.55.03 1-.42.97-.97c-.06-1.27-.26-3.5-.85-5.18M11.5 6.5c1.64 0 5-.38 6.71-1.07c.52-.2.55-.82.12-1.17A10 10 0 0 0 4.26 18.33c.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.88.88 0 0 0 .73-.74c.3-2.14-.15-3.5-.61-4.88"/><path d="M15.62 16.95c.2.85.62 2.76.5 4.28a.77.77 0 0 1-.9.7a16.6 16.6 0 0 1-4.08-1.36"/><path d="M16.13 21.05c1.65.63 3.68.84 4.87.91a.9.9 0 0 0 .96-.96a17.7 17.7 0 0 0-.9-4.87"/><path d="M16.94 15.62c.86.2 2.77.62 4.29.5a.77.77 0 0 0 .7-.9a16.6 16.6 0 0 0-1.36-4.08"/><path d="M17.99 5.52a20.8 20.8 0 0 1 3.15 4.5a.8.8 0 0 1-.68 1.13c-2.33.2-5.3-.32-8.27-1.57M4.93 4.93L3 3a.7.7 0 0 1 0-1m6.58 10.18c1.24 2.98 1.77 5.95 1.57 8.28a.8.8 0 0 1-1.13.68a20.8 20.8 0 0 1-4.5-3.15"/></g></svg>
React
import type { SVGProps } from "react";
export function LucideHop(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.55.03 1-.42.97-.97c-.06-1.27-.26-3.5-.85-5.18M11.5 6.5c1.64 0 5-.38 6.71-1.07c.52-.2.55-.82.12-1.17A10 10 0 0 0 4.26 18.33c.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.88.88 0 0 0 .73-.74c.3-2.14-.15-3.5-.61-4.88"/><path d="M15.62 16.95c.2.85.62 2.76.5 4.28a.77.77 0 0 1-.9.7a16.6 16.6 0 0 1-4.08-1.36"/><path d="M16.13 21.05c1.65.63 3.68.84 4.87.91a.9.9 0 0 0 .96-.96a17.7 17.7 0 0 0-.9-4.87"/><path d="M16.94 15.62c.86.2 2.77.62 4.29.5a.77.77 0 0 0 .7-.9a16.6 16.6 0 0 0-1.36-4.08"/><path d="M17.99 5.52a20.8 20.8 0 0 1 3.15 4.5a.8.8 0 0 1-.68 1.13c-2.33.2-5.3-.32-8.27-1.57M4.93 4.93L3 3a.7.7 0 0 1 0-1m6.58 10.18c1.24 2.98 1.77 5.95 1.57 8.28a.8.8 0 0 1-1.13.68a20.8 20.8 0 0 1-4.5-3.15"/></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.55.03 1-.42.97-.97c-.06-1.27-.26-3.5-.85-5.18M11.5 6.5c1.64 0 5-.38 6.71-1.07c.52-.2.55-.82.12-1.17A10 10 0 0 0 4.26 18.33c.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.88.88 0 0 0 .73-.74c.3-2.14-.15-3.5-.61-4.88"/><path d="M15.62 16.95c.2.85.62 2.76.5 4.28a.77.77 0 0 1-.9.7a16.6 16.6 0 0 1-4.08-1.36"/><path d="M16.13 21.05c1.65.63 3.68.84 4.87.91a.9.9 0 0 0 .96-.96a17.7 17.7 0 0 0-.9-4.87"/><path d="M16.94 15.62c.86.2 2.77.62 4.29.5a.77.77 0 0 0 .7-.9a16.6 16.6 0 0 0-1.36-4.08"/><path d="M17.99 5.52a20.8 20.8 0 0 1 3.15 4.5a.8.8 0 0 1-.68 1.13c-2.33.2-5.3-.32-8.27-1.57M4.93 4.93L3 3a.7.7 0 0 1 0-1m6.58 10.18c1.24 2.98 1.77 5.95 1.57 8.28a.8.8 0 0 1-1.13.68a20.8 20.8 0 0 1-4.5-3.15"/></g></svg> </template>
CSS
.icon-hop {
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.55.03%201-.42.97-.97c-.06-1.27-.26-3.5-.85-5.18M11.5%206.5c1.64%200%205-.38%206.71-1.07c.52-.2.55-.82.12-1.17A10%2010%200%200%200%204.26%2018.33c.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.88.88%200%200%200%20.73-.74c.3-2.14-.15-3.5-.61-4.88%22%2F%3E%3Cpath%20d%3D%22M15.62%2016.95c.2.85.62%202.76.5%204.28a.77.77%200%200%201-.9.7a16.6%2016.6%200%200%201-4.08-1.36%22%2F%3E%3Cpath%20d%3D%22M16.13%2021.05c1.65.63%203.68.84%204.87.91a.9.9%200%200%200%20.96-.96a17.7%2017.7%200%200%200-.9-4.87%22%2F%3E%3Cpath%20d%3D%22M16.94%2015.62c.86.2%202.77.62%204.29.5a.77.77%200%200%200%20.7-.9a16.6%2016.6%200%200%200-1.36-4.08%22%2F%3E%3Cpath%20d%3D%22M17.99%205.52a20.8%2020.8%200%200%201%203.15%204.5a.8.8%200%200%201-.68%201.13c-2.33.2-5.3-.32-8.27-1.57M4.93%204.93L3%203a.7.7%200%200%201%200-1m6.58%2010.18c1.24%202.98%201.77%205.95%201.57%208.28a.8.8%200%200%201-1.13.68a20.8%2020.8%200%200%201-4.5-3.15%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.55.03%201-.42.97-.97c-.06-1.27-.26-3.5-.85-5.18M11.5%206.5c1.64%200%205-.38%206.71-1.07c.52-.2.55-.82.12-1.17A10%2010%200%200%200%204.26%2018.33c.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.88.88%200%200%200%20.73-.74c.3-2.14-.15-3.5-.61-4.88%22%2F%3E%3Cpath%20d%3D%22M15.62%2016.95c.2.85.62%202.76.5%204.28a.77.77%200%200%201-.9.7a16.6%2016.6%200%200%201-4.08-1.36%22%2F%3E%3Cpath%20d%3D%22M16.13%2021.05c1.65.63%203.68.84%204.87.91a.9.9%200%200%200%20.96-.96a17.7%2017.7%200%200%200-.9-4.87%22%2F%3E%3Cpath%20d%3D%22M16.94%2015.62c.86.2%202.77.62%204.29.5a.77.77%200%200%200%20.7-.9a16.6%2016.6%200%200%200-1.36-4.08%22%2F%3E%3Cpath%20d%3D%22M17.99%205.52a20.8%2020.8%200%200%201%203.15%204.5a.8.8%200%200%201-.68%201.13c-2.33.2-5.3-.32-8.27-1.57M4.93%204.93L3%203a.7.7%200%200%201%200-1m6.58%2010.18c1.24%202.98%201.77%205.95%201.57%208.28a.8.8%200%200%201-1.13.68a20.8%2020.8%200%200%201-4.5-3.15%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.svg?color=%231a73e8&size=48
