Hover the icon or press Play. Suggested motion: pop. Pick another to preview it and update the animated code:

Lucide · LuHopOff

Hop Off icon

A free hop off icon from Lucide, ready for React. Use it static or animated: both versions are below, copy-paste or one shadcn command away. Sized in em and colored by currentColor.

Also known aspower icon on icon shutdown icon switch icon

License: ISC license
Project: lucide.dev

Download SVG

Install with shadcn

npx shadcn@latest add https://ui.cuelark.com/r/icons/lucide/hop-off.json

components/icons/lucide-hop-off.tsx

import * as React from "react";

/**
 * Hop Off from Lucide (https://lucide.dev/), ISC.
 * Via Cuelark UI: ui.cuelark.com/icons/lucide/hop-off. Sized in em, colored by currentColor.
 */
export function LuHopOffIcon(props: React.SVGProps<SVGSVGElement>) {
  return (
    <svg
      aria-hidden="true"
      fill="none"
      strokeWidth="2"
      viewBox="0 0 24 24"
      strokeLinecap="round"
      strokeLinejoin="round"
      stroke="currentColor"
      fill="currentColor"
      width="1em"
      height="1em"
      xmlns="http://www.w3.org/2000/svg"
      {...props}
    >
      <path d="M10.82 16.12c1.69.6 3.91.79 5.18.85.28.01.53-.09.7-.27" />
      <path
        d="M11.14 20.57c.52.24 2.44 1.12 4.08 1.37.46.06.86-.25.9-.71.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-.26" />
      <path
        d="M17.99 5.52a20.83 20.83 0 0 1 3.15 4.5.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.08.04.3-.08.59-.31.75" />
      <path
        d="M4.93 4.93a10 10 0 0 0-.67 13.4c.35.43.96.4 1.17-.12.69-1.71 1.07-5.07 1.07-6.71 1.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.28"
      />
      <path d="M8.35 2.68a10 10 0 0 1 9.98 1.58c.43.35.4.96-.12 1.17-1.5.6-4.3.98-6.07 1.05" />
      <path d="m2 2 20 20" />
    </svg>
  );
}

With react-icons

import { LuHopOff } from "react-icons/lu";

export function Example() {
  return <LuHopOff className="size-5" />;
}

hop-off.svg

<svg
  fill="none"
  stroke-width="2"
  viewBox="0 0 24 24"
  stroke-linecap="round"
  stroke-linejoin="round"
  stroke="currentColor"
  fill="currentColor"
  width="1em"
  height="1em"
  xmlns="http://www.w3.org/2000/svg"
>
  <path d="M10.82 16.12c1.69.6 3.91.79 5.18.85.28.01.53-.09.7-.27" />
  <path
    d="M11.14 20.57c.52.24 2.44 1.12 4.08 1.37.46.06.86-.25.9-.71.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-.26" />
  <path
    d="M17.99 5.52a20.83 20.83 0 0 1 3.15 4.5.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.08.04.3-.08.59-.31.75" />
  <path
    d="M4.93 4.93a10 10 0 0 0-.67 13.4c.35.43.96.4 1.17-.12.69-1.71 1.07-5.07 1.07-6.71 1.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.28"
  />
  <path d="M8.35 2.68a10 10 0 0 1 9.98 1.58c.43.35.4.96-.12 1.17-1.5.6-4.3.98-6.07 1.05" />
  <path d="m2 2 20 20" />
</svg>

Attribution

"Hop Off" icon from Lucide (https://lucide.dev/), licensed under ISC license.

Related icons: power, on, shutdown, switch

Similar Lucide icons