Vela UI Docs
venizia.ai

image-03

Image03, one of the 856 Vela UI icons, in the General 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-image-03.

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

Installation

pnpm dlx velaui add @velaui/icon-image-03

Usage

// components/icons/image-03.tsx
import Image03 from "@/components/icons/image-03"

<Image03 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 Image03Props extends React.SVGProps<SVGSVGElement> {
  size?: number | string;
}

/** Custom vela-ui icon, synced from Figma (node under section "Icons"). */
export function Image03({ size = 24, strokeWidth = 0, className, ref, ...props }: Image03Props) {
  return (
    <svg
      ref={ref}
      width={size}
      height={size}
      viewBox="0 0 24 24"
      fill="none"
      strokeWidth={strokeWidth}
      className={className}
      {...props}
    >
      <path d="M3.77145 18.9589C3.57618 19.1542 3.57618 19.4708 3.77145 19.6661C3.96671 19.8613 4.28329 19.8613 4.47855 19.6661L4.125 19.3125L3.77145 18.9589ZM8.625 14.8125L8.97855 14.4589C8.78329 14.2637 8.46671 14.2637 8.27145 14.4589L8.625 14.8125ZM10.875 17.0625L10.5214 17.4161C10.7167 17.6113 11.0333 17.6113 11.2286 17.4161L10.875 17.0625ZM15.9375 12L16.2911 11.6464C16.0958 11.4512 15.7792 11.4512 15.5839 11.6464L15.9375 12ZM20.0839 16.8536C20.2792 17.0488 20.5958 17.0488 20.7911 16.8536C20.9863 16.6583 20.9863 16.3417 20.7911 16.1464L20.4375 16.5L20.0839 16.8536ZM4.125 19.3125L4.47855 19.6661L8.97855 15.1661L8.625 14.8125L8.27145 14.4589L3.77145 18.9589L4.125 19.3125ZM8.625 14.8125L8.27145 15.1661L10.5214 17.4161L10.875 17.0625L11.2286 16.7089L8.97855 14.4589L8.625 14.8125ZM10.875 17.0625L11.2286 17.4161L16.2911 12.3536L15.9375 12L15.5839 11.6464L10.5214 16.7089L10.875 17.0625ZM15.9375 12L15.5839 12.3536L20.0839 16.8536L20.4375 16.5L20.7911 16.1464L16.2911 11.6464L15.9375 12ZM6.375 3V3.5H17.625V3V2.5H6.375V3ZM21 6.375H20.5V17.625H21H21.5V6.375H21ZM17.625 21V20.5H6.375V21V21.5H17.625V21ZM3 17.625H3.5V6.375H3H2.5V17.625H3ZM6.375 21V20.5C4.78718 20.5 3.5 19.2128 3.5 17.625H3H2.5C2.5 19.7651 4.2349 21.5 6.375 21.5V21ZM21 17.625H20.5C20.5 19.2128 19.2128 20.5 17.625 20.5V21V21.5C19.7651 21.5 21.5 19.7651 21.5 17.625H21ZM17.625 3V3.5C19.2128 3.5 20.5 4.78718 20.5 6.375H21H21.5C21.5 4.2349 19.7651 2.5 17.625 2.5V3ZM6.375 3V2.5C4.2349 2.5 2.5 4.2349 2.5 6.375H3H3.5C3.5 4.78718 4.78718 3.5 6.375 3.5V3ZM9.75 8.0625H9.25C9.25 8.71834 8.71834 9.25 8.0625 9.25V9.75V10.25C9.27062 10.25 10.25 9.27062 10.25 8.0625H9.75ZM8.0625 9.75V9.25C7.40666 9.25 6.875 8.71834 6.875 8.0625H6.375H5.875C5.875 9.27062 6.85438 10.25 8.0625 10.25V9.75ZM6.375 8.0625H6.875C6.875 7.40666 7.40666 6.875 8.0625 6.875V6.375V5.875C6.85438 5.875 5.875 6.85438 5.875 8.0625H6.375ZM8.0625 6.375V6.875C8.71834 6.875 9.25 7.40666 9.25 8.0625H9.75H10.25C10.25 6.85438 9.27062 5.875 8.0625 5.875V6.375Z" fill="currentColor"/>
    </svg>
  );
}
Image03.displayName = "Image03";

export default Image03;