Vela UI Docsvenizia.ai

webcam

Webcam, 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-webcam.

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

Installation

pnpm dlx velaui add @velaui/icon-webcam

Usage

// components/icons/webcam.tsx
import Webcam from "@/components/icons/webcam"

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

/** Custom vela-ui icon, synced from Figma (node under section "Icons"). */
export function Webcam({ size = 24, strokeWidth = 1, className, ref, ...props }: WebcamProps) {
  return (
    <svg
      ref={ref}
      width={size}
      height={size}
      viewBox="0 0 24 24"
      fill="none"
      strokeWidth={strokeWidth}
      className={className}
      {...props}
    >
      <path d="M12 16.6316C10.9391 16.6316 9.92172 16.188 9.17157 15.3983C8.42143 14.6087 8 13.5378 8 12.4211V8.21053C8 7.09383 8.42143 6.02286 9.17157 5.23323C9.92172 4.44361 10.9391 4 12 4C13.0609 4 14.0783 4.44361 14.8284 5.23323C15.5786 6.02286 16 7.09383 16 8.21053V12.4211C16 13.5378 15.5786 14.6087 14.8284 15.3983C14.0783 16.188 13.0609 16.6316 12 16.6316ZM12 16.6316V20M10.4 20H13.6M12 9.05263C12.2122 9.05263 12.4157 8.96391 12.5657 8.80598C12.7157 8.64806 12.8 8.43387 12.8 8.21053C12.8 7.98719 12.7157 7.77299 12.5657 7.61507C12.4157 7.45714 12.2122 7.36842 12 7.36842C11.7878 7.36842 11.5843 7.45714 11.4343 7.61507C11.2843 7.77299 11.2 7.98719 11.2 8.21053C11.2 8.43387 11.2843 8.64806 11.4343 8.80598C11.5843 8.96391 11.7878 9.05263 12 9.05263Z" stroke="currentColor" strokeLinecap="round" strokeLinejoin="round"/>
    </svg>
  );
}
Webcam.displayName = "Webcam";

export default Webcam;