Vela UI Docs
venizia.ai

star-02

Star02, 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-star-02.

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

Installation

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

Usage

// components/icons/star-02.tsx
import Star02 from "@/components/icons/star-02"

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

/** Custom vela-ui icon, synced from Figma (node under section "Icons"). */
export function Star02({ size = 24, strokeWidth = 1, className, ref, ...props }: Star02Props) {
  return (
    <svg
      ref={ref}
      width={size}
      height={size}
      viewBox="0 0 24 24"
      fill="none"
      strokeWidth={strokeWidth}
      className={className}
      {...props}
    >
      <path d="M11.495 2.7143C11.7015 2.29575 12.2984 2.29575 12.5049 2.7143L15.1789 8.13242C15.261 8.29863 15.4195 8.41383 15.6029 8.44048L21.5822 9.30932C22.0441 9.37644 22.2285 9.94406 21.8943 10.2698L17.5677 14.4873C17.4349 14.6166 17.3744 14.803 17.4057 14.9857L18.4271 20.9408C18.506 21.4008 18.0231 21.7516 17.61 21.5345L12.262 18.7228C12.0979 18.6366 11.902 18.6366 11.7379 18.7228L6.38989 21.5345C5.97676 21.7516 5.49392 21.4008 5.57282 20.9408L6.5942 14.9857C6.62553 14.803 6.56496 14.6166 6.43224 14.4873L2.10561 10.2698C1.77138 9.94406 1.95581 9.37644 2.41771 9.30932L8.39696 8.44048C8.58038 8.41383 8.73894 8.29863 8.82097 8.13242L11.495 2.7143Z" stroke="currentColor" strokeLinejoin="round"/>
    </svg>
  );
}
Star02.displayName = "Star02";

export default Star02;