Navbar

About this piece

Top bar with a logo tile, three menu items, and a primary action on the right.

Usage

The import and the props worth knowing about, in one place.

import { Shapes36 } from "@/components/beste/piece/shapes36";

<Shapes36
  surface="card"
  bordered={true}
  inverted={false}
/>

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

Three-segment stacked bar with a dotted legend underneath.

Five vertical bars with one taller emerald bar marking the peak.

Pill-shaped input with a magnifier icon and a placeholder line.

Image-topped tile with a title line, price block, and a circular add button.

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