Fieldbook
Sign in

Charts

Seamless share pie

A solid pie with its slices fused edge to edge and no gap or stroke between them, so hovering is the only thing that reveals where one share ends and the next begins.

Using Seamless share pie

A solid pie with its slices fused edge to edge and no gap or stroke between them, so hovering is the only thing that reveals where one share ends and the next begins.

Try the live preview with a pointer and keyboard, then check focus visibility and the narrow layout in your own page. Use the plate number or slug when asking your coding agent to fetch this component.

Props: accent, hueRange, seamOnHover, dimOthers, showReadout

Which frameworks are available?

The catalog lists these versions: react, vue, svelte, astro, html. The live preview on this page runs React.

How do I access the implementation?

The code, framework versions and installation commands are available in the workbench above.

Connect your agent

Nearby

Engraved label pie
2348Engraved label pieChartsA solid pie chart that sets each category name inside its own slice in an inverted color, so the breakdown reads without any outside labels or leader lines.
Plain Share Pie
2403Plain Share PieChartsThe bare essentials of a pie chart: five flush slices, a thin dividing stroke, and a hover tooltip, with nothing else added.
Chip legend pie
2316Chip legend pieChartsA solid pie chart with no on-slice labels, paired with a wrapped row of color chips beneath it that names every slice and highlights in sync on hover.
Donut share chart
2336Donut share chartChartsA five slice donut with a hollow centre and hairline gaps that sweeps open on mount and lifts whichever slice the pointer is over.
Leader line pie
2377Leader line pieChartsA solid pie chart whose values sit outside the circle, each tied back to its slice by a two-segment leader line.
Area chart lite
1525Area chart liteChartsA responsive SVG area chart with round axis ticks, a gradient fill, a crosshair that reads the sample under the pointer, and a draw-on wipe.