Data Visualization

dAta

15 visualization patterns for tracking dashboards. Charts, metrics, tables, and composed layouts — all built with Recharts, styled to the Alchemy token system.

Recharts 3.x
15 Patterns
Responsive
01

metricS

KPI cards with live trend indicators. The atomic unit of every tracking dashboard.

KPI Card · trend arrow · mono values · 4-up grid

Conversions Tracked

12,847

+23.4%vs last period

Match Quality

94.2%

+2.1%vs last period

Signal Coverage

87%

-1.3%vs last period

Events/Day

34.2K

+18.7%vs last period
02

line chart

Multi-series conversion trends across platforms. 12 months of tracked events.

LineChart · 3 series · custom tooltip · 12mo

Conversion Trends

Google Ads
Meta
TikTok
03

area chArt

Stacked revenue attribution with gradient fills. Shows channel contribution over time.

AreaChart · 4 channels · gradient defs · stacked

Revenue Attribution

Google
Meta
TikTok
Organic
04

bar chArt

Grouped bars comparing spend vs revenue by campaign. The core performance view.

BarChart · grouped · 6 campaigns · spend vs revenue

Campaign Performance

Spend
Revenue
05

horizontAl bar

Platform rankings by total conversions. Immediate visual hierarchy.

BarChart · horizontal · ranked · orange fill · labels

Top Platforms by Conversions

06

donut chart

Conversion source mix with proportional segments. Center label for total or key metric.

PieChart · donut · 5 segments · center label · orange/blue/neutral

Conversion Source Mix

12,847Total
Paid Search
38.2%
Paid Social
28.4%
Organic
18.7%
Direct
9.1%
Referral
5.6%
07

compoSed chart

Revenue bars with ROAS line overlay on dual Y-axis. The executive summary chart.

ComposedChart · bars + line · dual Y-axis · dashed ROAS · 12mo

Revenue & ROAS Trend

Revenue
ROAS
08

scatter chArt

Spend vs conversions correlation. Each dot is a campaign cohort — size encodes efficiency.

ScatterChart · spend vs conversions · translucent orange · 20 points

Spend vs Conversions

09

radar chart

Multi-axis health profile across 6 signal dimensions. Shows balance and gaps at a glance.

RadarChart · 6 dimensions · polar grid · orange fill · score labels

Channel Health Profile

Match Rate
94%
Coverage
87%
Freshness
91%
Accuracy
96%
Latency
78%
Redundancy
82%
10

stat lists

Ranked campaign performance with progress bars. Scannable top-performer leaderboard.

Ranked list · 5 rows · progress bar · mono metrics · revenue

Top Performing Campaigns

1
Brand Search — Exact
ROAS 8.4x$48.2K
2
Retarget — Cart Abandon
ROAS 6.2x$38.9K
3
Shopping — Top Products
ROAS 5.1x$36.7K
4
Prospecting — Lookalike 1%
ROAS 4.3x$42.1K
5
Video — YT In-Stream
ROAS 2.8x$18.2K
11

compArison cards

Side-by-side period comparison. This Period vs Last Period with calculated delta.

Comparison · 4 cards · period vs period · delta calc · trend color

Total Spend

This Period

$52,600

Last Period

$48,200

+9.1%

Total Revenue

This Period

$118,200

Last Period

$98,400

+20.1%

Avg CPA

This Period

$8.42

Last Period

$9.18

-8.3%

Blended ROAS

This Period

5.7x

Last Period

4.8x

+18.8%
12

sparklines

Inline mini charts embedded in metric rows. Trend at a glance without leaving the table.

Sparkline · 4 rows · inline LineChart · 12 points · no axis

MetricValueTrendChange
Conversions12,847
+23.4%
Avg CPA$8.42
-8.3%
Match Quality94.2%
+2.1%
Events/Day34.2K
+18.7%
13

progrEss gauges

Circular and linear progress indicators for KPI targets. Visual pacing at a glance.

Circular gauge · linear bar · 4 circular + 3 linear · percentage labels

Signal Health

94%
Pixel Coverage
87%
CAPI Events
62%
Offline Upload
78%
Enhanced Conv.

Campaign Pacing

Monthly Spend Pacing$52.6K of $72K
73%
Conversion Target12,847 of 14,500
89%
ROAS Goal5.7x of 6.0x
95%
14

data tAble

Sortable campaign table with type-aligned columns, sort indicators, and pagination.

DataTable · 7 columns · sort arrows · pagination · status badges · mono numbers

Campaign
Platform
Spend
Conv.
CPA
ROAS
Status
Brand Search — Exact MatchGoogle$12,4001,847$6.718.4x
Active
Retarget — Cart AbandonersMeta$8,6001,240$6.946.2x
Active
Shopping — Top ProductsGoogle$9,800980$10.005.1x
Active
Prospecting — LAL 1%Meta$15,2001,520$10.004.3x
Active
Video — YT In-StreamGoogle$6,400480$13.332.8x
Paused
Display — GDN ManagedGoogle$4,200210$20.001.9x
Active
Showing 1-6 of 24 campaigns
15

mini daShboard

Composed layout showing how metric cards, charts, and lists combine into a cohesive view.

Composition · 4 KPIs + AreaChart + Donut + Stat List · responsive grid

Revenue

$118.2K

+20.1%

ROAS

5.7x

+18.8%

Conversions

12,847

+23.4%

CPA

$8.42

-8.3%

Revenue Trend

Source Mix

12.8KConv

Top Campaigns

1
Brand Search — ExactROAS 8.4x
2
Retarget — Cart AbandonROAS 6.2x
3
Shopping — Top ProductsROAS 5.1x