Funnel

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

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

New here? Read the installation guide.

Import & use
import { Dashboard6 } from "@/components/beste/piece/dashboard6";

<Dashboard6
  stages={[
    {
      "label": "Visit",
      "value": 12400
    },
    {
      "label": "Sign-up",
      "value": 3420
    },
    {
      "label": "Active",
      "value": 1980
    },
    {
      "label": "Paid",
      "value": 620
    }
  ]}
  tone="primary"
/>

More Dashboard pieces

View all Dashboard
Top sources
1Direct
4,820
2Google
3,610
3Twitter
1,890
4Referral
980

Top List

Ranked list where each row's background bar fills proportionally to its value, with index and count on either end.

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.

Weekly sessions
186/ 220
34 to targetmax 300

Bullet Chart

Actual-vs-target bar with a tone-colored actual fill on a muted track and a thin foreground tick marking the target.

Date Range Toolbar

Dashboard filter bar with a primary date-range button, a comparison-period dropdown, and a segment filter toggle.

Top performers
Ada L.12,840
Marcus R.10,320
Priya S.8,960

Leaderboard

Top-three ranking card with gold, silver, and bronze medal circles next to names and monospaced scores.

Signups382
+12%
Revenue$18.4K
+6%
MAU9.8K
+3%

Sparkline Row

Stacked rows combining a label, value, inline tone-colored sparkline, and emerald delta on the right.

Markdown version