Vela UI Docs
venizia.ai

file-attach-01

FileAttach01, one of the 856 Vela UI icons, in the Files group: a 24px grid drawn in currentColor, so it takes the colour of the text around it. It installs on its own as @velaui/icon-file-attach-01.

  • 16px
  • 20px
  • 24px
  • 32px

Installation

pnpm dlx velaui add @velaui/icon-file-attach-01

Usage

// components/icons/file-attach-01.tsx
import FileAttach01 from "@/components/icons/file-attach-01"

<FileAttach01 className="size-5 text-muted" />

In use

  • In a button

  • In a sentence

    Due Friday, or whenever the venue confirms.

  • In an input

  • As a badge

    Scheduled

  • In an empty state

    No events on this day yet.

    Browse blocks

Source

import * as React from "react";

export interface FileAttach01Props extends React.SVGProps<SVGSVGElement> {
  size?: number | string;
}

/** Custom vela-ui icon, synced from Figma (node under section "Icons"). */
export function FileAttach01({ size = 24, strokeWidth = 1, className, ref, ...props }: FileAttach01Props) {
  return (
    <svg
      ref={ref}
      width={size}
      height={size}
      viewBox="0 0 24 24"
      fill="none"
      strokeWidth={strokeWidth}
      className={className}
      {...props}
    >
      <path d="M11.6998 21.5998H5.6998C4.37432 21.5998 3.2998 20.5253 3.29981 19.1998L3.29991 4.79989C3.29991 3.47441 4.37443 2.3999 5.69991 2.3999H16.5002C17.8257 2.3999 18.9002 3.47442 18.9002 4.7999V9.5999M7.50019 7.1999H14.7002M7.50019 10.7999H14.7002M14.7002 15.5539V18.4982C14.7002 19.9532 16.2516 21.2877 17.7066 21.2877C19.1615 21.2877 20.7002 19.9532 20.7002 18.4982V14.779C20.7002 14.0088 20.2574 13.2271 19.2724 13.2271C18.2186 13.2271 17.7066 14.0087 17.7066 14.779V18.3433M7.50019 14.3999H11.1002" stroke="currentColor" strokeLinecap="round" strokeLinejoin="round"/>
    </svg>
  );
}
FileAttach01.displayName = "FileAttach01";

export default FileAttach01;