Vela UI Docs
venizia.ai

bezier-01

Bezier01, 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-bezier-01.

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

Installation

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

Usage

// components/icons/bezier-01.tsx
import Bezier01 from "@/components/icons/bezier-01"

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

/** Custom vela-ui icon, synced from Figma (node under section "Icons"). */
export function Bezier01({ size = 24, strokeWidth = 1, className, ref, ...props }: Bezier01Props) {
  return (
    <svg
      ref={ref}
      width={size}
      height={size}
      viewBox="0 0 24 24"
      fill="none"
      strokeWidth={strokeWidth}
      className={className}
      {...props}
    >
      <path d="M4.50956 9.78074C5.26954 7.22714 7.3744 5.25274 10.0028 4.6789M9.4756 18.9641C7.09515 18.2557 5.21801 16.3785 4.50956 13.9981M18.659 13.9981C17.9505 16.3785 16.0734 18.2557 13.6929 18.9641M13.1658 4.6789C15.9724 5.29165 18.182 7.50132 18.7948 10.3079M10.3635 6.8397H13.027C13.5174 6.8397 13.9149 6.44219 13.9149 5.95184V3.28825C13.9149 2.7979 13.5174 2.40039 13.027 2.40039H10.3635C9.87311 2.40039 9.4756 2.7979 9.4756 3.28825V5.95184C9.4756 6.44219 9.87311 6.8397 10.3635 6.8397ZM10.3635 21.6004H13.027C13.5174 21.6004 13.9149 21.2029 13.9149 20.7125V18.0489C13.9149 17.5586 13.5174 17.1611 13.027 17.1611H10.3635C9.87311 17.1611 9.4756 17.5586 9.4756 18.0489V20.7125C9.4756 21.2029 9.87311 21.6004 10.3635 21.6004ZM16.1066 10.6683V13.3319C16.1066 13.8223 16.5041 14.2198 16.9944 14.2198H19.658C20.1484 14.2198 20.5459 13.8223 20.5459 13.3319V10.6683C20.5459 10.178 20.1484 9.78048 19.658 9.78048H16.9944C16.5041 9.78048 16.1066 10.178 16.1066 10.6683ZM2.4002 10.6683L2.4002 13.3319C2.4002 13.8223 2.79771 14.2198 3.28806 14.2198H5.95165C6.442 14.2198 6.83951 13.8223 6.83951 13.3319L6.83951 10.6683C6.83951 10.178 6.442 9.78048 5.95165 9.78048H3.28806C2.79771 9.78048 2.4002 10.178 2.4002 10.6683Z" stroke="currentColor"/>
    </svg>
  );
}
Bezier01.displayName = "Bezier01";

export default Bezier01;