Vela UI Docsvenizia.ai

wallet-01

Wallet01, 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-wallet-01.

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

Installation

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

Usage

// components/icons/wallet-01.tsx
import Wallet01 from "@/components/icons/wallet-01"

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

/** Custom vela-ui icon, synced from Figma (node under section "Icons"). */
export function Wallet01({ size = 24, strokeWidth = 0, className, ref, ...props }: Wallet01Props) {
  return (
    <svg
      ref={ref}
      width={size}
      height={size}
      viewBox="0 0 24 24"
      fill="none"
      strokeWidth={strokeWidth}
      className={className}
      {...props}
    >
      <path d="M21.6 16.5599V17.0599C21.8762 17.0599 22.1 16.836 22.1 16.5599H21.6ZM21.6 11.2799H22.1C22.1 11.0038 21.8762 10.7799 21.6 10.7799V11.2799ZM7.40964 6.5393C7.17736 6.68863 7.11011 6.99799 7.25943 7.23027C7.40876 7.46256 7.71812 7.52981 7.9504 7.38048L7.68002 6.95989L7.40964 6.5393ZM14.4 2.63989L14.7947 2.33292C14.6358 2.12865 14.3473 2.07936 14.1296 2.2193L14.4 2.63989ZM17.3653 7.26686C17.5349 7.48484 17.849 7.5241 18.067 7.35457C18.285 7.18503 18.3242 6.8709 18.1547 6.65292L17.76 6.95989L17.3653 7.26686ZM21.6 16.5599V16.0599H18.48V16.5599V17.0599H21.6V16.5599ZM18.48 11.2799V11.7799H21.6V11.2799V10.7799H18.48V11.2799ZM21.6 11.2799H21.1V16.5599H21.6H22.1V11.2799H21.6ZM15.84 13.9199H16.34C16.34 12.738 17.2981 11.7799 18.48 11.7799V11.2799V10.7799C16.7458 10.7799 15.34 12.1857 15.34 13.9199H15.84ZM18.48 16.5599V16.0599C17.2981 16.0599 16.34 15.1018 16.34 13.9199H15.84H15.34C15.34 15.6541 16.7458 17.0599 18.48 17.0599V16.5599ZM7.68002 6.95989L7.9504 7.38048L14.6704 3.06048L14.4 2.63989L14.1296 2.2193L7.40964 6.5393L7.68002 6.95989ZM14.4 2.63989L14.0053 2.94686L17.3653 7.26686L17.76 6.95989L18.1547 6.65292L14.7947 2.33292L14.4 2.63989ZM3.36002 6.95989V7.45989H19.68V6.95989V6.45989H3.36002V6.95989ZM19.68 21.3599V20.8599H3.36002V21.3599V21.8599H19.68V21.3599ZM2.40002 20.3999H2.90002V7.91989H2.40002H1.90002V20.3999H2.40002ZM3.36002 21.3599V20.8599C3.10597 20.8599 2.90002 20.6539 2.90002 20.3999H2.40002H1.90002C1.90002 21.2062 2.55369 21.8599 3.36002 21.8599V21.3599ZM20.64 20.3999H20.14C20.14 20.6539 19.9341 20.8599 19.68 20.8599V21.3599V21.8599C20.4864 21.8599 21.14 21.2062 21.14 20.3999H20.64ZM19.68 6.95989V7.45989C19.9341 7.45989 20.14 7.66584 20.14 7.91989H20.64H21.14C21.14 7.11356 20.4864 6.45989 19.68 6.45989V6.95989ZM3.36002 6.95989V6.45989C2.55369 6.45989 1.90002 7.11356 1.90002 7.91989H2.40002H2.90002C2.90002 7.66584 3.10597 7.45989 3.36002 7.45989V6.95989ZM20.64 17.2799H20.14V20.3999H20.64H21.14V17.2799H20.64ZM20.64 7.91989H20.14V10.4399H20.64H21.14V7.91989H20.64Z" fill="currentColor"/>
    </svg>
  );
}
Wallet01.displayName = "Wallet01";

export default Wallet01;