Vela UI Docsvenizia.ai

camera-02

Camera02, 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-camera-02.

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

Installation

pnpm dlx velaui add @velaui/icon-camera-02

Usage

// components/icons/camera-02.tsx
import Camera02 from "@/components/icons/camera-02"

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

/** Custom vela-ui icon, synced from Figma (node under section "Icons"). */
export function Camera02({ size = 24, strokeWidth = 0, className, ref, ...props }: Camera02Props) {
  return (
    <svg
      ref={ref}
      width={size}
      height={size}
      viewBox="0 0 24 24"
      fill="none"
      strokeWidth={strokeWidth}
      className={className}
      {...props}
    >
      <path d="M2.4 18.12H2.9V5.87998H2.4H1.9V18.12H2.4ZM4.8 3.47998V3.97998H19.2V3.47998V2.97998H4.8V3.47998ZM21.6 5.87998H21.1V18.12H21.6H22.1V5.87998H21.6ZM21.6 18.12H21.1C21.1 19.1693 20.2493 20.02 19.2 20.02V20.52V21.02C20.8016 21.02 22.1 19.7216 22.1 18.12H21.6ZM19.2 3.47998V3.97998C20.2493 3.97998 21.1 4.83064 21.1 5.87998H21.6H22.1C22.1 4.27835 20.8016 2.97998 19.2 2.97998V3.47998ZM2.4 5.87998H2.9C2.9 4.83064 3.75066 3.97998 4.8 3.97998V3.47998V2.97998C3.19838 2.97998 1.9 4.27835 1.9 5.87998H2.4ZM4.8 20.52V20.02C3.75066 20.02 2.9 19.1693 2.9 18.12H2.4H1.9C1.9 19.7216 3.19838 21.02 4.8 21.02V20.52ZM15.6 12.0001H15.1C15.1 13.7122 13.7121 15.1001 12 15.1001V15.6001V16.1001C14.2644 16.1001 16.1 14.2645 16.1 12.0001H15.6ZM12 15.6001V15.1001C10.2879 15.1001 8.9 13.7122 8.9 12.0001H8.4H7.9C7.9 14.2645 9.73563 16.1001 12 16.1001V15.6001ZM8.4 12.0001H8.9C8.9 10.288 10.2879 8.9001 12 8.9001V8.4001V7.9001C9.73563 7.9001 7.9 9.73573 7.9 12.0001H8.4ZM12 8.4001V8.9001C13.7121 8.9001 15.1 10.288 15.1 12.0001H15.6H16.1C16.1 9.73573 14.2644 7.9001 12 7.9001V8.4001ZM19.2 20.52V20.02H4.8V20.52V21.02H19.2V20.52Z" fill="currentColor"/>
    </svg>
  );
}
Camera02.displayName = "Camera02";

export default Camera02;