Vela UI Docs
venizia.ai

user-profile-add-02

UserProfileAdd02, 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-02.

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

Installation

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

Usage

// components/icons/user-profile-add-02.tsx
import UserProfileAdd02 from "@/components/icons/user-profile-add-02"

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

/** Custom vela-ui icon, synced from Figma (node under section "Icons"). */
export function UserProfileAdd02({ size = 24, strokeWidth = 0, className, ref, ...props }: UserProfileAdd02Props) {
  return (
    <svg
      ref={ref}
      width={size}
      height={size}
      viewBox="0 0 24 24"
      fill="none"
      strokeWidth={strokeWidth}
      className={className}
      {...props}
    >
      <path d="M21 17C21.2761 17 21.5 16.7761 21.5 16.5C21.5 16.2239 21.2761 16 21 16V16.5V17ZM15.6 16C15.3239 16 15.1 16.2239 15.1 16.5C15.1 16.7761 15.3239 17 15.6 17V16.5V16ZM17.8 19.1999C17.8 19.476 18.0239 19.6999 18.3 19.6999C18.5761 19.6999 18.8 19.476 18.8 19.1999H18.3H17.8ZM18.8 13.7999C18.8 13.5237 18.5761 13.2999 18.3 13.2999C18.0239 13.2999 17.8 13.5237 17.8 13.7999H18.3H18.8ZM13.8254 20.3095C14.0987 20.2703 14.2885 20.0169 14.2493 19.7436C14.21 19.4702 13.9567 19.2805 13.6833 19.3197L13.7544 19.8146L13.8254 20.3095ZM12.9479 14.1045C13.2225 14.1333 13.4685 13.934 13.4973 13.6593C13.5261 13.3847 13.3268 13.1387 13.0521 13.1099L13 13.6072L12.9479 14.1045ZM11 20V19.5C8.60655 19.5 6.68299 19.1146 5.37776 18.5199C4.04506 17.9127 3.5 17.1657 3.5 16.5H3H2.5C2.5 17.7673 3.51555 18.7703 4.96315 19.4299C6.43822 20.1019 8.51466 20.5 11 20.5V20ZM3 16.5H3.5C3.5 16.3596 3.60503 16.1135 4.01503 15.7918C4.40735 15.4839 4.99264 15.1776 5.72411 14.9063C7.18322 14.3652 9.12418 14 11 14V13.5V13C9.00983 13 6.95079 13.3848 5.37639 13.9687C4.59111 14.2599 3.90128 14.6099 3.39766 15.0051C2.91172 15.3864 2.5 15.8904 2.5 16.5H3ZM14 7.05501H13.5C13.5 8.33264 12.3816 9.5 11 9.5V10V10.5C12.9322 10.5 14.5 8.88662 14.5 7.05501H14ZM11 10V9.5C9.61844 9.5 8.5 8.33264 8.5 7.05501H8H7.5C7.5 8.88662 9.06785 10.5 11 10.5V10ZM8 7.05501H8.5C8.5 5.75379 9.6415 4.5 11 4.5V4V3.5C9.04479 3.5 7.5 5.247 7.5 7.05501H8ZM11 4V4.5C12.3585 4.5 13.5 5.75379 13.5 7.05501H14H14.5C14.5 5.247 12.9552 3.5 11 3.5V4ZM21 16.5V16H18.3V16.5V17H21V16.5ZM18.3 16.5V16H15.6V16.5V17H18.3V16.5ZM18.3 19.1999H18.8V16.5H18.3H17.8V19.1999H18.3ZM18.3 16.5H18.8V13.7999H18.3H17.8V16.5H18.3ZM13.7544 19.8146L13.6833 19.3197C12.8716 19.4362 11.9735 19.5 11 19.5V20V20.5C12.0167 20.5 12.9625 20.4334 13.8254 20.3095L13.7544 19.8146ZM11 13.5V14C11.626 14 12.2867 14.0352 12.9479 14.1045L13 13.6072L13.0521 13.1099C12.358 13.0371 11.6625 13 11 13V13.5Z" fill="currentColor"/>
    </svg>
  );
}
UserProfileAdd02.displayName = "UserProfileAdd02";

export default UserProfileAdd02;