Skip to content
Cuelark UI

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

VS Code Icons · VscDebugConnected

Debug Connected icon

A free debug connected icon from VS Code Icons, 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.

License
CC BY 4.0 license
Project
github.com
Install with shadcn
npx shadcn@latest add https://ui.cuelark.com/r/icons/vscode-codicons/debug-connected.json
components/icons/vscode-codicons-debug-connected.tsx
import * as React from "react";

/**
 * Debug Connected from VS Code Icons (https://github.com/microsoft/vscode-codicons), CC BY 4.0.
 * Via Cuelark UI: ui.cuelark.com/icons/vscode-codicons/debug-connected. Sized in em, colored by currentColor.
 */
export function VscDebugConnectedIcon(props: React.SVGProps<SVGSVGElement>) {
  return (
    <svg
      aria-hidden="true"
      viewBox="0 0 16 16"
      stroke="currentColor"
      fill="currentColor"
      strokeWidth="0"
      width="1em"
      height="1em"
      xmlns="http://www.w3.org/2000/svg"
      {...props}
    >
      <path
        d="M6.01298 6.77501C5.52698 6.28801 4.73198 6.28801 4.24498 6.77501L4.02498 6.99501C3.34898 7.67001 2.98498 8.56901 2.99998 9.52401C3.01198 10.28 3.25998 10.994 3.70998 11.583L1.64698 13.646C1.45198 13.841 1.45198 14.158 1.64698 14.353C1.74498 14.451 1.87298 14.499 2.00098 14.499C2.12898 14.499 2.25698 14.45 2.35498 14.353L4.42498 12.283C5.02198 12.718 5.73698 12.935 6.46098 12.935C7.39898 12.935 8.34898 12.572 9.06498 11.855L9.19598 11.724C9.68298 11.237 9.68298 10.444 9.19598 9.95601L6.01398 6.77401L6.01298 6.77501ZM8.48798 11.018L8.35698 11.149C7.36298 12.144 5.76098 12.208 4.78898 11.291C4.29098 10.823 4.01198 10.19 4.00098 9.50801C3.99098 8.82601 4.25098 8.18401 4.73298 7.70201L4.95298 7.48201C5.00198 7.43301 5.06498 7.40901 5.12998 7.40901C5.19498 7.40901 5.25798 7.43301 5.30698 7.48201L8.48898 10.664C8.58698 10.762 8.58698 10.92 8.48898 11.018H8.48798ZM14.354 1.64601C14.159 1.45101 13.842 1.45101 13.647 1.64601L11.577 3.71601C10.207 2.71701 8.20698 2.87301 6.93698 4.14401L6.80598 4.27501C6.31898 4.76201 6.31898 5.55501 6.80598 6.04301L9.98798 9.22501C10.231 9.46901 10.551 9.59101 10.872 9.59101C11.193 9.59101 11.513 9.46901 11.756 9.22501L11.976 9.00501C12.652 8.33001 13.016 7.43101 13.001 6.47601C12.989 5.72001 12.741 5.00601 12.291 4.41701L14.354 2.35401C14.549 2.15901 14.549 1.84101 14.354 1.64601ZM11.268 8.29701L11.048 8.51701C10.95 8.61501 10.792 8.61501 10.694 8.51701L7.51198 5.33501C7.41398 5.23701 7.41398 5.07901 7.51198 4.98101L7.64298 4.85001C8.16698 4.32601 8.85998 4.06001 9.53998 4.06001C10.15 4.06001 10.751 4.27401 11.211 4.70801C11.709 5.17601 11.988 5.80901 11.999 6.49101C12.009 7.17301 11.75 7.81501 11.268 8.29701Z"
      />
    </svg>
  );
}
With react-icons
import { VscDebugConnected } from "react-icons/vsc";

export function Example() {
  return <VscDebugConnected className="size-5" />;
}
debug-connected.svg
<svg
  viewBox="0 0 16 16"
  stroke="currentColor"
  fill="currentColor"
  stroke-width="0"
  width="1em"
  height="1em"
  xmlns="http://www.w3.org/2000/svg"
>
  <path
    d="M6.01298 6.77501C5.52698 6.28801 4.73198 6.28801 4.24498 6.77501L4.02498 6.99501C3.34898 7.67001 2.98498 8.56901 2.99998 9.52401C3.01198 10.28 3.25998 10.994 3.70998 11.583L1.64698 13.646C1.45198 13.841 1.45198 14.158 1.64698 14.353C1.74498 14.451 1.87298 14.499 2.00098 14.499C2.12898 14.499 2.25698 14.45 2.35498 14.353L4.42498 12.283C5.02198 12.718 5.73698 12.935 6.46098 12.935C7.39898 12.935 8.34898 12.572 9.06498 11.855L9.19598 11.724C9.68298 11.237 9.68298 10.444 9.19598 9.95601L6.01398 6.77401L6.01298 6.77501ZM8.48798 11.018L8.35698 11.149C7.36298 12.144 5.76098 12.208 4.78898 11.291C4.29098 10.823 4.01198 10.19 4.00098 9.50801C3.99098 8.82601 4.25098 8.18401 4.73298 7.70201L4.95298 7.48201C5.00198 7.43301 5.06498 7.40901 5.12998 7.40901C5.19498 7.40901 5.25798 7.43301 5.30698 7.48201L8.48898 10.664C8.58698 10.762 8.58698 10.92 8.48898 11.018H8.48798ZM14.354 1.64601C14.159 1.45101 13.842 1.45101 13.647 1.64601L11.577 3.71601C10.207 2.71701 8.20698 2.87301 6.93698 4.14401L6.80598 4.27501C6.31898 4.76201 6.31898 5.55501 6.80598 6.04301L9.98798 9.22501C10.231 9.46901 10.551 9.59101 10.872 9.59101C11.193 9.59101 11.513 9.46901 11.756 9.22501L11.976 9.00501C12.652 8.33001 13.016 7.43101 13.001 6.47601C12.989 5.72001 12.741 5.00601 12.291 4.41701L14.354 2.35401C14.549 2.15901 14.549 1.84101 14.354 1.64601ZM11.268 8.29701L11.048 8.51701C10.95 8.61501 10.792 8.61501 10.694 8.51701L7.51198 5.33501C7.41398 5.23701 7.41398 5.07901 7.51198 4.98101L7.64298 4.85001C8.16698 4.32601 8.85998 4.06001 9.53998 4.06001C10.15 4.06001 10.751 4.27401 11.211 4.70801C11.709 5.17601 11.988 5.80901 11.999 6.49101C12.009 7.17301 11.75 7.81501 11.268 8.29701Z"
  />
</svg>
Attribution
"Debug Connected" icon from VS Code Icons (https://github.com/microsoft/vscode-codicons), licensed under CC BY 4.0 license.

Related icons: bug, issue, error, insect