Vela UI Docsvenizia.ai

ticket-02

Ticket02, 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-ticket-02.

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

Installation

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

Usage

// components/icons/ticket-02.tsx
import Ticket02 from "@/components/icons/ticket-02"

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

/** Custom vela-ui icon, synced from Figma (node under section "Icons"). */
export function Ticket02({ size = 24, strokeWidth = 1, className, ref, ...props }: Ticket02Props) {
  return (
    <svg
      ref={ref}
      width={size}
      height={size}
      viewBox="0 0 24 24"
      fill="none"
      strokeWidth={strokeWidth}
      className={className}
      {...props}
    >
      <path d="M14.3995 14.86V8.95358M5.01172 3.45996H12.001C12.0407 4.87503 13.2003 6.00996 14.625 6.00996C16.0496 6.00996 17.2092 4.87503 17.2489 3.45996H18.9882C21.0934 3.45996 22.7999 5.16655 22.7999 7.27173V16.7287C22.7999 18.8338 21.0934 20.5404 18.9882 20.5404H17.2489C17.2092 19.1254 16.0496 17.9904 14.625 17.9904C13.2003 17.9904 12.0407 19.1254 12.001 20.5404H5.01173C2.90655 20.5404 1.19996 18.8338 1.19996 16.7287L1.19995 7.27173C1.19995 5.16655 2.90654 3.45996 5.01172 3.45996Z" stroke="currentColor" strokeLinecap="round" strokeLinejoin="round"/>
    </svg>
  );
}
Ticket02.displayName = "Ticket02";

export default Ticket02;