Vela UI Docs
venizia.ai

glasses-01

Glasses01, 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-glasses-01.

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

Installation

pnpm dlx velaui add @velaui/icon-glasses-01

Usage

// components/icons/glasses-01.tsx
import Glasses01 from "@/components/icons/glasses-01"

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

/** Custom vela-ui icon, synced from Figma (node under section "Icons"). */
export function Glasses01({ size = 24, strokeWidth = 0, className, ref, ...props }: Glasses01Props) {
  return (
    <svg
      ref={ref}
      width={size}
      height={size}
      viewBox="0 0 24 24"
      fill="none"
      strokeWidth={strokeWidth}
      className={className}
      {...props}
    >
      <path d="M9.12002 12.0001H8.62002C8.62002 13.5797 7.33956 14.8601 5.76002 14.8601V15.3601V15.8601C7.89184 15.8601 9.62002 14.132 9.62002 12.0001H9.12002ZM5.76002 15.3601V14.8601C4.18049 14.8601 2.90002 13.5797 2.90002 12.0001H2.40002H1.90002C1.90002 14.132 3.6282 15.8601 5.76002 15.8601V15.3601ZM2.40002 12.0001H2.90002C2.90002 10.4206 4.18049 9.14014 5.76002 9.14014V8.64014V8.14014C3.6282 8.14014 1.90002 9.86832 1.90002 12.0001H2.40002ZM5.76002 8.64014V9.14014C7.33956 9.14014 8.62002 10.4206 8.62002 12.0001H9.12002H9.62002C9.62002 9.86832 7.89184 8.14014 5.76002 8.14014V8.64014ZM9.08955 11.2801L9.52236 11.5305C10.0176 10.6743 10.9421 10.1001 12 10.1001V9.60014V9.10014C10.5707 9.10014 9.32341 9.87732 8.65675 11.0298L9.08955 11.2801ZM12 9.60014V10.1001C13.058 10.1001 13.9825 10.6743 14.4777 11.5305L14.9105 11.2801L15.3433 11.0298C14.6767 9.87732 13.4294 9.10014 12 9.10014V9.60014ZM21.6 12.0001H21.1C21.1 13.5797 19.8196 14.8601 18.24 14.8601V15.3601V15.8601C20.3718 15.8601 22.1 14.132 22.1 12.0001H21.6ZM18.24 15.3601V14.8601C16.6605 14.8601 15.38 13.5797 15.38 12.0001H14.88H14.38C14.38 14.132 16.1082 15.8601 18.24 15.8601V15.3601ZM14.88 12.0001H15.38C15.38 10.4206 16.6605 9.14014 18.24 9.14014V8.64014V8.14014C16.1082 8.14014 14.38 9.86832 14.38 12.0001H14.88ZM18.24 8.64014V9.14014C19.8196 9.14014 21.1 10.4206 21.1 12.0001H21.6H22.1C22.1 9.86832 20.3718 8.14014 18.24 8.14014V8.64014Z" fill="currentColor"/>
    </svg>
  );
}
Glasses01.displayName = "Glasses01";

export default Glasses01;