Vela UI Docs
venizia.ai

eye-closed

EyeClosed, 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-eye-closed.

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

Installation

pnpm dlx velaui add @velaui/icon-eye-closed

Usage

// components/icons/eye-closed.tsx
import EyeClosed from "@/components/icons/eye-closed"

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

/** Custom vela-ui icon, synced from Figma (node under section "Icons"). */
export function EyeClosed({ size = 24, strokeWidth = 1, className, ref, ...props }: EyeClosedProps) {
  return (
    <svg
      ref={ref}
      width={size}
      height={size}
      viewBox="0 0 24 24"
      fill="none"
      strokeWidth={strokeWidth}
      className={className}
      {...props}
    >
      <path d="M20.4 19.5L5.39999 4.5M10.2 10.4416C9.82658 10.8533 9.59999 11.394 9.59999 11.9863C9.59999 13.2761 10.6745 14.3217 12 14.3217C12.6111 14.3217 13.1689 14.0994 13.5926 13.7334M20.4388 14.3217C21.265 13.0848 21.6 12.0761 21.6 12.0761C21.6 12.0761 19.4154 5.1 12 5.1C11.5837 5.1 11.1839 5.12199 10.8 5.16349M17.4 17.3494C16.0226 18.2281 14.2493 18.8495 12 18.8127C4.67692 18.693 2.39999 12.0761 2.39999 12.0761C2.39999 12.0761 3.45785 8.69808 6.59999 6.64332" stroke="currentColor" strokeLinecap="round"/>
    </svg>
  );
}
EyeClosed.displayName = "EyeClosed";

export default EyeClosed;