Vela UI Docs
venizia.ai

user-profile-add-01

UserProfileAdd01, 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-user-profile-add-01.

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

Installation

pnpm dlx velaui add @velaui/icon-user-profile-add-01

Usage

// components/icons/user-profile-add-01.tsx
import UserProfileAdd01 from "@/components/icons/user-profile-add-01"

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

/** Custom vela-ui icon, synced from Figma (node under section "Icons"). */
export function UserProfileAdd01({ size = 24, strokeWidth = 0, className, ref, ...props }: UserProfileAdd01Props) {
  return (
    <svg
      ref={ref}
      width={size}
      height={size}
      viewBox="0 0 24 24"
      fill="none"
      strokeWidth={strokeWidth}
      className={className}
      {...props}
    >
      <path d="M1.89999 21.5998C1.89996 21.876 2.1238 22.0999 2.39994 22.0999C2.67608 22.0999 2.89996 21.8761 2.89999 21.6L2.39999 21.5999L1.89999 21.5998ZM2.4004 17.9995L2.9004 17.9996L2.4004 17.9995ZM12.6 14.8999C12.8761 14.8999 13.1 14.676 13.1 14.3999C13.1 14.1238 12.8761 13.8999 12.6 13.8999V14.3999V14.8999ZM21.6 16.0999C21.8761 16.0999 22.1 15.876 22.1 15.5999C22.1 15.3238 21.8761 15.0999 21.6 15.0999V15.5999V16.0999ZM16.2 15.0999C15.9238 15.0999 15.7 15.3238 15.7 15.5999C15.7 15.876 15.9238 16.0999 16.2 16.0999V15.5999V15.0999ZM18.4 18.2998C18.4 18.5759 18.6238 18.7998 18.9 18.7998C19.1761 18.7998 19.4 18.5759 19.4 18.2998H18.9H18.4ZM19.4 12.8998C19.4 12.6236 19.1761 12.3998 18.9 12.3998C18.6238 12.3998 18.4 12.6236 18.4 12.8998H18.9H19.4ZM14.4 5.9999H13.9C13.9 7.71198 12.5121 9.0999 10.8 9.0999V9.5999V10.0999C13.0644 10.0999 14.9 8.26427 14.9 5.9999H14.4ZM10.8 9.5999V9.0999C9.08791 9.0999 7.69999 7.71198 7.69999 5.9999H7.19999H6.69999C6.69999 8.26427 8.53562 10.0999 10.8 10.0999V9.5999ZM7.19999 5.9999H7.69999C7.69999 4.28782 9.08791 2.8999 10.8 2.8999V2.3999V1.8999C8.53562 1.8999 6.69999 3.73553 6.69999 5.9999H7.19999ZM10.8 2.3999V2.8999C12.5121 2.8999 13.9 4.28782 13.9 5.9999H14.4H14.9C14.9 3.73553 13.0644 1.8999 10.8 1.8999V2.3999ZM2.39999 21.5999L2.89999 21.6L2.9004 17.9996L2.4004 17.9995L1.9004 17.9994L1.89999 21.5998L2.39999 21.5999ZM6.0004 14.3999V13.8999C3.73621 13.8999 1.90065 15.7353 1.9004 17.9994L2.4004 17.9995L2.9004 17.9996C2.90059 16.2876 4.28845 14.8999 6.0004 14.8999V14.3999ZM6.0004 14.3999V14.8999H12.6V14.3999V13.8999H6.0004V14.3999ZM21.6 15.5999V15.0999H18.9V15.5999V16.0999H21.6V15.5999ZM18.9 15.5999V15.0999H16.2V15.5999V16.0999H18.9V15.5999ZM18.9 18.2998H19.4V15.5999H18.9H18.4V18.2998H18.9ZM18.9 15.5999H19.4V12.8998H18.9H18.4V15.5999H18.9Z" fill="currentColor"/>
    </svg>
  );
}
UserProfileAdd01.displayName = "UserProfileAdd01";

export default UserProfileAdd01;