Signal Bars

Stair-step signal bars with an optional network label like 5G or Wi-Fi.

5G

Requires shadcn/ui initialized. Run npx shadcn@latest init if you haven't.

Import & use
import { Indicator5 } from "@/components/beste/piece/indicator5";

<Indicator5
  bars={3}
  total={4}
  label="5G"
/>

More Indicator pieces

View all Indicator
5GGood

Signal Bars

indicator10

Four ascending bars that fill with the current reception level, paired with a network name and label.

3 / 5

Step Dots

indicator2

Row of small dots showing progress through N steps, with a trailing fraction count.

Syncing workspace

Spinner Pill

indicator3

Spinning loader icon paired with a status label inside a rounded pill.

Live

Status Pill

indicator1

Pulsing status dot in four tints: live, beta, paused, offline.

System status

SchedulingOperational
Billing syncOperational
Records exportDegraded

Status List Card

indicator13

A compact status panel listing services, each with a colored dot and an operational state.

+12.4%vs last week

Trend Delta

indicator8

Inline percent change with a directional arrow, green for up and rose for down, beside a compare period.