Skip to content
Cuelark UI

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

Remix Icon · RiSwitchLine

Switch Line icon

A free switch line icon from Remix Icon, 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 iconon iconoff iconshutdown icon
License
Apache License Version 2.0
Project
github.com
Download SVG
Install with shadcn
npx shadcn@latest add https://ui.cuelark.com/r/icons/remix/switch-line.json
components/icons/remix-switch-line.tsx
import * as React from "react";

/**
 * Switch Line from Remix Icon (https://github.com/Remix-Design/RemixIcon), Apache License Version 2.0.
 * Via Cuelark UI: ui.cuelark.com/icons/remix/switch-line. Sized in em, colored by currentColor.
 */
export function RiSwitchLineIcon(props: React.SVGProps<SVGSVGElement>) {
  return (
    <svg
      aria-hidden="true"
      viewBox="0 0 24 24"
      stroke="currentColor"
      fill="currentColor"
      strokeWidth="0"
      width="1em"
      height="1em"
      xmlns="http://www.w3.org/2000/svg"
      {...props}
    >
      <path
        d="M12.001 3V21H7.60098C5.06047 21 3.00098 18.9405 3.00098 16.4V7.6C3.00098 5.05949 5.06047 3 7.60098 3H12.001ZM10.001 5H7.60098C6.16504 5 5.00098 6.16406 5.00098 7.6V16.4C5.00098 17.8359 6.16504 19 7.60098 19H10.001V5ZM7.50098 10C6.67255 10 6.00098 9.32843 6.00098 8.5C6.00098 7.67157 6.67255 7 7.50098 7C8.3294 7 9.00098 7.67157 9.00098 8.5C9.00098 9.32843 8.3294 10 7.50098 10ZM14.001 3H16.401C18.9415 3 21.001 5.05949 21.001 7.6V16.4C21.001 18.9405 18.9415 21 16.401 21H14.001V3ZM17.001 14.7C17.9951 14.7 18.801 13.8941 18.801 12.9C18.801 11.9059 17.9951 11.1 17.001 11.1C16.0069 11.1 15.201 11.9059 15.201 12.9C15.201 13.8941 16.0069 14.7 17.001 14.7Z"
      />
    </svg>
  );
}
With react-icons
import { RiSwitchLine } from "react-icons/ri";

export function Example() {
  return <RiSwitchLine className="size-5" />;
}
switch-line.svg
<svg
  viewBox="0 0 24 24"
  stroke="currentColor"
  fill="currentColor"
  stroke-width="0"
  width="1em"
  height="1em"
  xmlns="http://www.w3.org/2000/svg"
>
  <path
    d="M12.001 3V21H7.60098C5.06047 21 3.00098 18.9405 3.00098 16.4V7.6C3.00098 5.05949 5.06047 3 7.60098 3H12.001ZM10.001 5H7.60098C6.16504 5 5.00098 6.16406 5.00098 7.6V16.4C5.00098 17.8359 6.16504 19 7.60098 19H10.001V5ZM7.50098 10C6.67255 10 6.00098 9.32843 6.00098 8.5C6.00098 7.67157 6.67255 7 7.50098 7C8.3294 7 9.00098 7.67157 9.00098 8.5C9.00098 9.32843 8.3294 10 7.50098 10ZM14.001 3H16.401C18.9415 3 21.001 5.05949 21.001 7.6V16.4C21.001 18.9405 18.9415 21 16.401 21H14.001V3ZM17.001 14.7C17.9951 14.7 18.801 13.8941 18.801 12.9C18.801 11.9059 17.9951 11.1 17.001 11.1C16.0069 11.1 15.201 11.9059 15.201 12.9C15.201 13.8941 16.0069 14.7 17.001 14.7Z"
  />
</svg>
Attribution
"Switch Line" icon from Remix Icon (https://github.com/Remix-Design/RemixIcon), licensed under Apache License Version 2.0.

Related icons: power, on, off, shutdown