Vela UI Docsvenizia.ai

currency-coin-pound

CurrencyCoinPound, 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-currency-coin-pound.

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

Installation

pnpm dlx velaui add @velaui/icon-currency-coin-pound

Usage

// components/icons/currency-coin-pound.tsx
import CurrencyCoinPound from "@/components/icons/currency-coin-pound"

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

/** Custom vela-ui icon, synced from Figma (node under section "Icons"). */
export function CurrencyCoinPound({ size = 24, strokeWidth = 1, className, ref, ...props }: CurrencyCoinPoundProps) {
  return (
    <svg
      ref={ref}
      width={size}
      height={size}
      viewBox="0 0 24 24"
      fill="none"
      strokeWidth={strokeWidth}
      className={className}
      {...props}
    >
      <path d="M15.6 16.1087C15.0408 16.365 14.433 16.4977 13.8178 16.4977C13.2027 16.4977 12.5948 16.365 12.0357 16.1087C11.4511 15.9069 10.8297 15.8343 10.2144 15.8958C9.59903 15.9574 9.00434 16.1516 8.47131 16.4652C8.853 16.333 9.18947 16.0955 9.44179 15.7802C9.69411 15.4648 9.85195 15.0844 9.89705 14.683V9.33644C9.90082 8.71192 10.1095 8.1059 10.4911 7.61148C10.8726 7.11706 11.406 6.76158 12.0092 6.59965C12.6123 6.43772 13.252 6.4783 13.8299 6.71515C14.4078 6.952 14.8919 7.37202 15.2079 7.9107M13.3901 12.1879H8.40002M21.6 11.9999C21.6 17.3018 17.302 21.5999 12 21.5999C6.69809 21.5999 2.40002 17.3018 2.40002 11.9999C2.40002 6.69797 6.69809 2.3999 12 2.3999C17.302 2.3999 21.6 6.69797 21.6 11.9999Z" stroke="currentColor" strokeLinecap="round" strokeLinejoin="round"/>
    </svg>
  );
}
CurrencyCoinPound.displayName = "CurrencyCoinPound";

export default CurrencyCoinPound;