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

Radix Icons · RxComponent2

Component2 icon

A free component2 icon from Radix 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: MIT license
Project: icons.radix-ui.com

Download SVG

Install with shadcn

npx shadcn@latest add https://ui.cuelark.com/r/icons/radix/component2.json

components/icons/radix-component2.tsx

import * as React from "react";

/**
 * Component2 from Radix Icons (https://icons.radix-ui.com), MIT.
 * Via Cuelark UI: ui.cuelark.com/icons/radix/component2. Sized in em, colored by currentColor.
 */
export function RxComponent2Icon(props: React.SVGProps<SVGSVGElement>) {
  return (
    <svg
      aria-hidden="true"
      fill="none"
      viewBox="0 0 15 15"
      stroke="currentColor"
      fill="currentColor"
      strokeWidth="0"
      width="1em"
      height="1em"
      xmlns="http://www.w3.org/2000/svg"
      {...props}
    >
      <path
        d="M11.6641 1.00293C11.8347 1.00564 11.9883 1.01122 12.126 1.02246C12.407 1.04543 12.6656 1.09414 12.9082 1.21777L13.0459 1.29492C13.3592 1.48707 13.6145 1.76256 13.7822 2.0918C13.9059 2.33444 13.9546 2.59301 13.9775 2.87402C14 3.14924 14 3.4886 14 3.90039V11.0996C14 11.5114 14 11.8508 13.9775 12.126C13.9603 12.3367 13.9284 12.5345 13.8613 12.7227L13.7822 12.9082C13.6145 13.2374 13.3592 13.5129 13.0459 13.7051L12.9082 13.7822C12.6656 13.9059 12.407 13.9546 12.126 13.9775C11.8508 14 11.5114 14 11.0996 14H3.90039C3.4886 14 3.14924 14 2.87402 13.9775C2.59301 13.9546 2.33444 13.9059 2.0918 13.7822C1.76256 13.6145 1.48707 13.3592 1.29492 13.0459L1.21777 12.9082C1.09414 12.6656 1.04543 12.407 1.02246 12.126C1.01122 11.9883 1.00564 11.8347 1.00293 11.6641L1 11.0996V3.90039C1 3.4886 0.999975 3.14924 1.02246 2.87402C1.04543 2.59301 1.09414 2.33444 1.21777 2.0918C1.40951 1.71554 1.71554 1.40951 2.0918 1.21777C2.33444 1.09414 2.59301 1.04543 2.87402 1.02246C3.14924 0.999975 3.4886 1 3.90039 1H11.0996L11.6641 1.00293ZM2 8V11.0996L2.00293 11.6484C2.00533 11.8029 2.00936 11.9324 2.01855 12.0449C2.03647 12.2639 2.06956 12.376 2.10938 12.4541L2.19141 12.5879C2.28366 12.7148 2.40484 12.8187 2.5459 12.8906C2.62405 12.9304 2.73615 12.9635 2.95508 12.9814C3.18012 12.9998 3.4721 13 3.90039 13H7V8H2ZM8 8V13H11.0996C11.5279 13 11.8199 12.9998 12.0449 12.9814C12.2639 12.9635 12.376 12.9304 12.4541 12.8906L12.5879 12.8086C12.7148 12.7163 12.8187 12.5952 12.8906 12.4541L12.9189 12.3877C12.9457 12.313 12.968 12.2091 12.9814 12.0449C12.9998 11.8199 13 11.5279 13 11.0996V8H8ZM3.90039 2C3.4721 2 3.18012 2.00017 2.95508 2.01855C2.73615 2.03647 2.62405 2.06956 2.5459 2.10938C2.35793 2.20521 2.20521 2.35793 2.10938 2.5459C2.06956 2.62405 2.03647 2.73615 2.01855 2.95508C2.00017 3.18012 2 3.4721 2 3.90039V7H7V2H3.90039ZM8 7H13V3.90039C13 3.4721 12.9998 3.18012 12.9814 2.95508C12.9635 2.73615 12.9304 2.62405 12.8906 2.5459C12.8187 2.40484 12.7148 2.28366 12.5879 2.19141L12.4541 2.10938C12.376 2.06956 12.2639 2.03647 12.0449 2.01855C11.9324 2.00936 11.8029 2.00533 11.6484 2.00293L11.0996 2H8V7Z"
        fill="currentColor"
      />
    </svg>
  );
}

With react-icons

import { RxComponent2 } from "react-icons/rx";

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

component2.svg

<svg
  fill="none"
  viewBox="0 0 15 15"
  stroke="currentColor"
  fill="currentColor"
  stroke-width="0"
  width="1em"
  height="1em"
  xmlns="http://www.w3.org/2000/svg"
>
  <path
    d="M11.6641 1.00293C11.8347 1.00564 11.9883 1.01122 12.126 1.02246C12.407 1.04543 12.6656 1.09414 12.9082 1.21777L13.0459 1.29492C13.3592 1.48707 13.6145 1.76256 13.7822 2.0918C13.9059 2.33444 13.9546 2.59301 13.9775 2.87402C14 3.14924 14 3.4886 14 3.90039V11.0996C14 11.5114 14 11.8508 13.9775 12.126C13.9603 12.3367 13.9284 12.5345 13.8613 12.7227L13.7822 12.9082C13.6145 13.2374 13.3592 13.5129 13.0459 13.7051L12.9082 13.7822C12.6656 13.9059 12.407 13.9546 12.126 13.9775C11.8508 14 11.5114 14 11.0996 14H3.90039C3.4886 14 3.14924 14 2.87402 13.9775C2.59301 13.9546 2.33444 13.9059 2.0918 13.7822C1.76256 13.6145 1.48707 13.3592 1.29492 13.0459L1.21777 12.9082C1.09414 12.6656 1.04543 12.407 1.02246 12.126C1.01122 11.9883 1.00564 11.8347 1.00293 11.6641L1 11.0996V3.90039C1 3.4886 0.999975 3.14924 1.02246 2.87402C1.04543 2.59301 1.09414 2.33444 1.21777 2.0918C1.40951 1.71554 1.71554 1.40951 2.0918 1.21777C2.33444 1.09414 2.59301 1.04543 2.87402 1.02246C3.14924 0.999975 3.4886 1 3.90039 1H11.0996L11.6641 1.00293ZM2 8V11.0996L2.00293 11.6484C2.00533 11.8029 2.00936 11.9324 2.01855 12.0449C2.03647 12.2639 2.06956 12.376 2.10938 12.4541L2.19141 12.5879C2.28366 12.7148 2.40484 12.8187 2.5459 12.8906C2.62405 12.9304 2.73615 12.9635 2.95508 12.9814C3.18012 12.9998 3.4721 13 3.90039 13H7V8H2ZM8 8V13H11.0996C11.5279 13 11.8199 12.9998 12.0449 12.9814C12.2639 12.9635 12.376 12.9304 12.4541 12.8906L12.5879 12.8086C12.7148 12.7163 12.8187 12.5952 12.8906 12.4541L12.9189 12.3877C12.9457 12.313 12.968 12.2091 12.9814 12.0449C12.9998 11.8199 13 11.5279 13 11.0996V8H8ZM3.90039 2C3.4721 2 3.18012 2.00017 2.95508 2.01855C2.73615 2.03647 2.62405 2.06956 2.5459 2.10938C2.35793 2.20521 2.20521 2.35793 2.10938 2.5459C2.06956 2.62405 2.03647 2.73615 2.01855 2.95508C2.00017 3.18012 2 3.4721 2 3.90039V7H7V2H3.90039ZM8 7H13V3.90039C13 3.4721 12.9998 3.18012 12.9814 2.95508C12.9635 2.73615 12.9304 2.62405 12.8906 2.5459C12.8187 2.40484 12.7148 2.28366 12.5879 2.19141L12.4541 2.10938C12.376 2.06956 12.2639 2.03647 12.0449 2.01855C11.9324 2.00936 11.8029 2.00533 11.6484 2.00293L11.0996 2H8V7Z"
    fill="currentColor"
  />
</svg>

Attribution

"Component2" icon from Radix Icons (https://icons.radix-ui.com), licensed under MIT license.

Similar Radix Icons icons