Step Indicator

Four nodes connected by lines, two complete, the third active, the last pending.

New here? Read the installation guide.

Import & use
import { Shapes21 } from "@/components/beste/piece/shapes21";

<Shapes21 />

More Shapes pieces

View all Shapes

Multi-step Form

Three-node progress strip above a card with two fields and back-next actions.

Workflow Boxes

Three squares connected by arrows, stepping from outline to fill.

Tab Bar

Three tab labels above a divider, with a foreground indicator under the active one.

Tree Diagram

A filled parent node branches into two outlined children.

Geometric Trio

Triangle, circle, and square primitives lined up in three tones.

Stats Row

Three small KPI tiles in a row, each with a label and a bold value bar.

Markdown version