Metric Ring

87%
Cache hitlast 1h
About this piece

Metric Ring

Circular progress dial holding a percentage at its center, captioned with a label and supporting hint.

Usage

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

import { Monitoring9 } from "@/components/beste/piece/monitoring9";

<Monitoring9
  label="Cache hit"
  value={87}
  unit="%"
  hint="last 1h"
  tone="sky"
/>

More Monitoring pieces

View all Monitoring
API Gateway
Operational99.98%

Service Status

Compact service health row with operational state, pulsing dot, and uptime percentage on the right.

Requests
12.4Kreq/s
+12%

Throughput Counter

Headline number for traffic volume with a trend arrow and tinted delta badge against a prior window.

82%Error budget

SLO Gauge

Semicircular gauge that renders a remaining-budget percentage along a single recolorable arc.

7/10

Token Bucket

Rate-limit row that maps remaining capacity to a chain of filled and hollow dots, with a count beside it.

CPU
72%

Resource Meter

Utilization bar for CPU, memory, disk, or network with a recolorable fill and matching percentage label.

api
42ms
db

Service Link

Inline edge between two named endpoints, drawn as a status-tinted stem with the round-trip latency floating mid-span.