New Component: Dashboard Cards Chart — Now on the Marketplace! 🎉

Hey Adalo Community! :waving_hand:

I’m excited to share a new component that’s now available on the Adalo Marketplace:

Dashboard Cards Chart

Stat cards with Show/Hide toggles that control which lines appear on an animated multi-line chart

A combined analytics widget that shows a row of stat cards alongside an interactive multi-line chart. Each card displays a label and metric value – tapping Show/Hide toggles its corresponding chart line, letting users focus on the series that matter most.

Key Features

:white_check_mark: Up to 4 stat cards, each with its own label, value, and color-coded chart line
:white_check_mark: Show/Hide toggle buttons on each card control chart line visibility
:white_check_mark: Animated multi-line Victory chart with smooth curved or straight interpolation
:white_check_mark: Configurable dot markers and optional data value labels on each point
:white_check_mark: Two independent Adalo list connections – one for cards, one for chart time-series data
:white_check_mark: Y-axis range control: Auto, Start at Zero, or Manual min/max
:white_check_mark: Optional grid lines, configurable axis label colors and sizes
:white_check_mark: Full color control for cards, buttons, lines, dots, labels, and axes
:white_check_mark: Card text line 1 & 2 with independent size, color, and weight controls
:white_check_mark: Outputs card labels as Magic Text values for use in other components
:white_check_mark: Automatic x-axis deduplication for normalized multi-row collections
:white_check_mark: Works on Web, iOS, and Android

Perfect For

• Sales dashboards showing revenue, orders, customers, and avg order value over time
• Fitness apps comparing steps, calories, active minutes, and distance by day
• Project tracking screens with tasks completed, bugs, and PRs by week
• E-commerce analytics with daily performance by channel
• Financial reporting with fixed y-axis scale for consistent period-over-period comparison

How to Get It

  1. Open your Adalo app editor
  2. Click the + button to open the Add Components panel
  3. Browse Marketplace Components or search for “Dashboard Cards Chart”
  4. Click to add it to your app — done!

If you have any questions or feedback, drop a comment below. I’d love to hear how you’re using it! :rocket:

4 Likes