Performance Curves

About this block

Performance Curves is a comparison drawn as a chart instead of a table. A heading, supporting paragraph, and a CTA sit beside a bordered panel where two SVG lines run across six labeled quarters: a primary curve for teams on Acme rising as it compounds, and a muted line for the status quo running flat with a slight droop. The rising curve ends in a highlighted dot with the result printed beside it, and a caption explains how the data is indexed.

Both curves are plain points strings, the quarter labels are a small array, and the end label is one string, so adjusting the story takes a few minutes of coordinate editing and no charting library. The muted versus primary palette carries the contrast in both themes without red and green.

When to use

Reach for this block when your advantage grows with time rather than appearing on day one. It makes a compounding argument that before-after cannot, since before and after implies a single jump, and it stays more visual than dimension-rows. Use grouped-bar-comparison instead when your wins are discrete metrics, or switch-banner when you just need a light nudge between sections.

A natural flow around it on a Marketing Pro page:

Before

• Case Studies so a real customer curve precedes the aggregate one

After

• Pricing while the compounding math is fresh
• CTAs for readers who want their curve to start this quarter

What you can display

One strong use is pipeline compounding against a flat status quo. Other diverging pairs:

• Costs. A falling acquisition cost curve against a slowly rising one, with the end label naming the savings.
• Output. Campaigns shipped per quarter accelerating as automation takes over routine work.
• Retention. Cohort retention holding for Acme while the alternative decays, told over six months.

Tip: let the curves share a starting point, divergence from a common origin is the whole argument of this block.