Radar Chart
RadarChart comparing two plans across five feature dimensions with filled polygons and a shared legend.
RadarChart comparing two plans across five feature dimensions with filled polygons and a shared legend.
Search blocks by description or jump to a page.
The source for every Application block is included with Basic and Pro. Pick a plan to copy the code.
Already purchased? Log in
Radar Chart is the plan feature coverage panel, two filled polygons overlaid on five axes: API access, Automation, Analytics, Integrations, and Support tier. Starter scores 40 on API access and 30 on Automation; Growth scores 90 and 85 on the same axes, making the gap visible as empty polygon area. Both series carry a legend and use var(--chart-1) and var(--chart-2) at low fill opacity so the overlap region reads clearly.
Radar data is a flat array with one object per dimension, both plan values as keys. The footnote calls out where the gap is widest: API access and automation depth.
Reach for this block on a pricing or plan comparison page where you want to communicate multi-dimensional coverage differences at a glance. Wire the five dimensions and two series to your feature matrix; add a third Radar if you have three tiers.
A natural flow around it on an Application Pro page:
Before
After
One strong use is the tier comparison panel. Other radar reads:
Tip: keep axes to five or six; more than seven makes every polygon look like a circle and the gaps disappear.