Skip to content
Cuelark UI

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

VS Code Icons · VscKeyboardTabAbove

Keyboard Tab Above icon

A free keyboard tab above 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/keyboard-tab-above.json
components/icons/vscode-codicons-keyboard-tab-above.tsx
import * as React from "react";

/**
 * Keyboard Tab Above from VS Code Icons (https://github.com/microsoft/vscode-codicons), CC BY 4.0.
 * Via Cuelark UI: ui.cuelark.com/icons/vscode-codicons/keyboard-tab-above. Sized in em, colored by currentColor.
 */
export function VscKeyboardTabAboveIcon(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="M1.501 3C1.777 3 2.001 3.224 2.001 3.5V6.5C2.001 7.327 2.674 8 3.501 8H11.294L8.648 5.354C8.453 5.159 8.453 4.842 8.648 4.647C8.843 4.452 9.16 4.452 9.355 4.647L12.855 8.147C13.05 8.342 13.05 8.659 12.855 8.854L9.355 12.354C9.257 12.452 9.129 12.5 9.001 12.5C8.873 12.5 8.745 12.451 8.647 12.354C8.452 12.159 8.452 11.842 8.647 11.647L11.293 9.001H3.5C2.121 9.001 1 7.88 1 6.501V3.501C1 3.225 1.224 3.001 1.5 3.001L1.501 3Z"
      />
      <path
        d="M14 4.00093V13.0009L14.008 13.0909C14.0303 13.2139 14.0977 13.324 14.1972 13.3997C14.2966 13.4754 14.4207 13.5111 14.5452 13.4998C14.6696 13.4885 14.7853 13.431 14.8695 13.3387C14.9537 13.2464 15.0002 13.1259 15 13.0009V4.00093L14.992 3.91093C14.9697 3.78798 14.9023 3.67782 14.8028 3.60215C14.7034 3.52647 14.5793 3.49076 14.4548 3.50205C14.3304 3.51334 14.2147 3.57081 14.1305 3.66314C14.0463 3.75548 13.9998 3.87598 14 4.00093Z"
      />
    </svg>
  );
}
With react-icons
import { VscKeyboardTabAbove } from "react-icons/vsc";

export function Example() {
  return <VscKeyboardTabAbove className="size-5" />;
}
keyboard-tab-above.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="M1.501 3C1.777 3 2.001 3.224 2.001 3.5V6.5C2.001 7.327 2.674 8 3.501 8H11.294L8.648 5.354C8.453 5.159 8.453 4.842 8.648 4.647C8.843 4.452 9.16 4.452 9.355 4.647L12.855 8.147C13.05 8.342 13.05 8.659 12.855 8.854L9.355 12.354C9.257 12.452 9.129 12.5 9.001 12.5C8.873 12.5 8.745 12.451 8.647 12.354C8.452 12.159 8.452 11.842 8.647 11.647L11.293 9.001H3.5C2.121 9.001 1 7.88 1 6.501V3.501C1 3.225 1.224 3.001 1.5 3.001L1.501 3Z"
  />
  <path
    d="M14 4.00093V13.0009L14.008 13.0909C14.0303 13.2139 14.0977 13.324 14.1972 13.3997C14.2966 13.4754 14.4207 13.5111 14.5452 13.4998C14.6696 13.4885 14.7853 13.431 14.8695 13.3387C14.9537 13.2464 15.0002 13.1259 15 13.0009V4.00093L14.992 3.91093C14.9697 3.78798 14.9023 3.67782 14.8028 3.60215C14.7034 3.52647 14.5793 3.49076 14.4548 3.50205C14.3304 3.51334 14.2147 3.57081 14.1305 3.66314C14.0463 3.75548 13.9998 3.87598 14 4.00093Z"
  />
</svg>
Attribution
"Keyboard Tab Above" icon from VS Code Icons (https://github.com/microsoft/vscode-codicons), licensed under CC BY 4.0 license.

Related icons: type, typing, input, keys