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

VS Code Icons · VscBracketDot

Bracket Dot icon

A free bracket dot 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

Download SVG

Install with shadcn

npx shadcn@latest add https://ui.cuelark.com/r/icons/vscode-codicons/bracket-dot.json

components/icons/vscode-codicons-bracket-dot.tsx

import * as React from "react";

/**
 * Bracket Dot from VS Code Icons (https://github.com/microsoft/vscode-codicons), CC BY 4.0.
 * Via Cuelark UI: ui.cuelark.com/icons/vscode-codicons/bracket-dot. Sized in em, colored by currentColor.
 */
export function VscBracketDotIcon(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="M10.5 2.5C10.5 2.224 10.724 2 11 2C12.105 2 13 2.895 13 4V6.005C13 6.535 13.008 6.799 13.089 7.002C13.152 7.158 13.284 7.333 13.723 7.553C13.892 7.638 13.999 7.811 13.999 8C13.999 8.189 13.892 8.363 13.723 8.447C13.284 8.667 13.151 8.841 13.089 8.998C13.072 9.041 13.058 9.088 13.046 9.139C12.729 9.053 12.397 9.005 12.055 9.001C12.079 8.872 12.112 8.747 12.16 8.627C12.257 8.384 12.403 8.18 12.598 8C12.402 7.821 12.257 7.616 12.16 7.374C11.998 6.971 11.999 6.51 11.999 6.063V4C11.999 3.448 11.551 3 10.999 3C10.723 3 10.499 2.776 10.499 2.5H10.5ZM3.83898 7.374C4.00098 6.971 3.99998 6.51 3.99998 6.063V4C3.99998 3.448 4.44798 3 4.99998 3C5.27598 3 5.49998 2.776 5.49998 2.5C5.49998 2.224 5.27598 2 4.99998 2C3.89498 2 2.99998 2.895 2.99998 4V6.005C2.99998 6.535 2.99198 6.799 2.91098 7.002C2.84798 7.158 2.71598 7.333 2.27698 7.553C2.10798 7.638 2.00098 7.811 2.00098 8C2.00098 8.189 2.10798 8.363 2.27698 8.447C2.71598 8.667 2.84898 8.841 2.91098 8.998C2.99298 9.202 2.99998 9.467 2.99998 10V12C2.99998 13.105 3.89498 14 4.99998 14C5.27598 14 5.49998 13.776 5.49998 13.5C5.49998 13.224 5.27598 13 4.99998 13C4.44798 13 3.99998 12.552 3.99998 12V9.941C3.99998 9.492 3.99998 9.03 3.83898 8.626C3.74198 8.383 3.59598 8.179 3.39998 7.999C3.59598 7.82 3.74098 7.615 3.83798 7.373L3.83898 7.374ZM12 10C10.343 10 8.99998 11.343 8.99998 13C8.99998 14.657 10.343 16 12 16C13.657 16 15 14.657 15 13C15 11.343 13.657 10 12 10Z"
      />
    </svg>
  );
}

With react-icons

import { VscBracketDot } from "react-icons/vsc";

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

bracket-dot.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="M10.5 2.5C10.5 2.224 10.724 2 11 2C12.105 2 13 2.895 13 4V6.005C13 6.535 13.008 6.799 13.089 7.002C13.152 7.158 13.284 7.333 13.723 7.553C13.892 7.638 13.999 7.811 13.999 8C13.999 8.189 13.892 8.363 13.723 8.447C13.284 8.667 13.151 8.841 13.089 8.998C13.072 9.041 13.058 9.088 13.046 9.139C12.729 9.053 12.397 9.005 12.055 9.001C12.079 8.872 12.112 8.747 12.16 8.627C12.257 8.384 12.403 8.18 12.598 8C12.402 7.821 12.257 7.616 12.16 7.374C11.998 6.971 11.999 6.51 11.999 6.063V4C11.999 3.448 11.551 3 10.999 3C10.723 3 10.499 2.776 10.499 2.5H10.5ZM3.83898 7.374C4.00098 6.971 3.99998 6.51 3.99998 6.063V4C3.99998 3.448 4.44798 3 4.99998 3C5.27598 3 5.49998 2.776 5.49998 2.5C5.49998 2.224 5.27598 2 4.99998 2C3.89498 2 2.99998 2.895 2.99998 4V6.005C2.99998 6.535 2.99198 6.799 2.91098 7.002C2.84798 7.158 2.71598 7.333 2.27698 7.553C2.10798 7.638 2.00098 7.811 2.00098 8C2.00098 8.189 2.10798 8.363 2.27698 8.447C2.71598 8.667 2.84898 8.841 2.91098 8.998C2.99298 9.202 2.99998 9.467 2.99998 10V12C2.99998 13.105 3.89498 14 4.99998 14C5.27598 14 5.49998 13.776 5.49998 13.5C5.49998 13.224 5.27598 13 4.99998 13C4.44798 13 3.99998 12.552 3.99998 12V9.941C3.99998 9.492 3.99998 9.03 3.83898 8.626C3.74198 8.383 3.59598 8.179 3.39998 7.999C3.59598 7.82 3.74098 7.615 3.83798 7.373L3.83898 7.374ZM12 10C10.343 10 8.99998 11.343 8.99998 13C8.99998 14.657 10.343 16 12 16C13.657 16 15 14.657 15 13C15 11.343 13.657 10 12 10Z"
  />
</svg>

Attribution

"Bracket Dot" icon from VS Code Icons (https://github.com/microsoft/vscode-codicons), licensed under CC BY 4.0 license.

Related icons:

Similar VS Code Icons icons