Cohort Retention

Weekly cohort grid where each cell's opacity scales with the retention percentage in the tone color.

Retention
W0W1W2W3W4
W0
100
64
48
41
38
W1
100
71
55
46
W2
100
68
52
W3
100
74

New here? Read the installation guide.

Import & use
import { Dashboard12 } from "@/components/beste/piece/dashboard12";

<Dashboard12
  heading="Retention"
  cohorts={[
    "W0",
    "W1",
    "W2",
    "W3"
  ]}
  weeks={[
    "W0",
    "W1",
    "W2",
    "W3",
    "W4"
  ]}
  retention={[
    [
      100,
      64,
      48,
      41,
      38
    ],
    [
      100,
      71,
      55,
      46,
      0
    ],
    [
      100,
      68,
      52,
      0,
      0
    ],
    [
      100,
      74,
      0,
      0,
      0
    ]
  ]}
  tone="violet"
/>

More Dashboard pieces

View all Dashboard
Revenue$48.2K
Orders1,284
Users9.4K
Events62.1K

Widget Grid

Two-by-two KPI grid where each cell carries a tone-tinted icon tile, label, and monospaced value.

Events this week2,840
Mon
Tue
Wed
Thu
Fri
Sat
Sun

Weekly Bars

Seven vertical bars for a rolling week with muted fills for past days and a tone-saturated bar for today's total.

Visit
12,400
Sign-up
3,42072%
Active
1,98042%
Paid
62069%

Funnel

Conversion funnel stages where each row's bar narrows against the top stage and a rose drop-off percentage marks churn.

68%
Storage used34 GB of 50 GB

Progress Circle

Radial progress gauge with a tone-colored arc, the percentage centered, and a caption line beside it.

api.prod.example99.94%
60 days agoToday

Uptime Status

Status-page timeline where every day is a thin vertical tile colored by up, degraded, outage, or no-data state.

Traffic by device9,420 sessions
  • Mobile58%
  • Desktop32%
  • Tablet8%
  • Other2%

Stacked Bar

Horizontal 100 percent stacked bar splitting a total into colored segments with a wrapping legend of labels and percentages.

Markdown version