Vela UI Docsvenizia.ai

gift-02

Gift02, 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-gift-02.

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

Installation

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

Usage

// components/icons/gift-02.tsx
import Gift02 from "@/components/icons/gift-02"

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

/** Custom vela-ui icon, synced from Figma (node under section "Icons"). */
export function Gift02({ size = 24, strokeWidth = 1, className, ref, ...props }: Gift02Props) {
  return (
    <svg
      ref={ref}
      width={size}
      height={size}
      viewBox="0 0 24 24"
      fill="none"
      strokeWidth={strokeWidth}
      className={className}
      {...props}
    >
      <path d="M2.4001 14.0957L2.39991 8.82796C2.39986 7.50245 3.47438 6.42788 4.79989 6.42787L19.2001 6.42776C20.5256 6.42775 21.6001 7.50227 21.6001 8.82776V14.0957M2.4001 14.0957H21.6001M2.4001 14.0957L2.3999 19.6277C2.39986 20.9532 3.47439 22.0277 4.7999 22.0277H19.2001C20.5256 22.0277 21.6001 20.9532 21.6001 19.6277V14.0957M12.1746 22.0277V6.42775M10.9643 5.92255C11.144 5.91517 11.3101 5.82068 11.3995 5.66594C11.4888 5.5112 11.4875 5.32003 11.4041 5.16075C11.0855 4.58005 9.96742 2.64918 9.23775 2.22791C8.32868 1.70305 7.16098 2.01273 6.63873 2.91731C6.11651 3.82182 6.43206 4.98794 7.3412 5.51283C8.0828 5.941 10.3021 5.93695 10.9643 5.92255ZM12.6347 5.16059C12.5512 5.31992 12.55 5.51103 12.6393 5.66578C12.7287 5.82052 12.8949 5.91496 13.0745 5.92239C13.7368 5.93677 15.968 5.93395 16.6976 5.51267C17.6067 4.98782 17.9224 3.82173 17.4001 2.91715C16.8779 2.01264 15.7102 1.70285 14.8011 2.22774C14.0595 2.65591 12.9533 4.5799 12.6347 5.16059Z" stroke="currentColor" strokeLinecap="round" strokeLinejoin="round"/>
    </svg>
  );
}
Gift02.displayName = "Gift02";

export default Gift02;