Vela UI Docs
venizia.ai

map-02

Map02, 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-map-02.

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

Installation

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

Usage

// components/icons/map-02.tsx
import Map02 from "@/components/icons/map-02"

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

/** Custom vela-ui icon, synced from Figma (node under section "Icons"). */
export function Map02({ size = 24, strokeWidth = 1, className, ref, ...props }: Map02Props) {
  return (
    <svg
      ref={ref}
      width={size}
      height={size}
      viewBox="0 0 24 24"
      fill="none"
      strokeWidth={strokeWidth}
      className={className}
      {...props}
    >
      <path d="M3.22915 5.66667L18.4297 20.5065M3.22915 5.66667C3.7947 5.021 4.63942 4.61111 5.58316 4.61111H10.7218M3.22915 5.66667C2.77429 6.18596 2.5 6.85777 2.5 7.5915V18.5196C2.5 20.1656 3.88038 21.5 5.58316 21.5H16.8881C18.5909 21.5 19.9713 20.1656 19.9713 18.5196V14.049M10.7218 14.049L4.04158 20.5065M18.0057 5.87778V5.81428M21.5 5.80435C21.5 8.00725 18.0057 10.9444 18.0057 10.9444C18.0057 10.9444 14.5115 8.00725 14.5115 5.80435C14.5115 3.97941 16.0759 2.5 18.0057 2.5C19.9356 2.5 21.5 3.97941 21.5 5.80435Z" stroke="currentColor" strokeLinecap="round" strokeLinejoin="round"/>
    </svg>
  );
}
Map02.displayName = "Map02";

export default Map02;