Aero Donut Chart

The most advanced donut chart on the marketplace, offering highly customizable vector rendering and fluid interactive feedback to create a premium data experience.

Features

• Customizable data segment arrays with distinct color and active-shadow states for exact brand alignment.

• Variable ring thickness and gap spacing parameters for complete structural control over the chart’s density.

• Toggleable rounded cap geometry for softening the visual aesthetic of the data arcs.

• Selectable hover or click interaction models for adapting the component to your specific UX requirements.

• Dynamic center labels with full Framer typography integration for clear, at-a-glance context.

• Integrated prefix and suffix value formatting for accurate localized currency or metric display.

• Independent color mapping for the background track and text elements for seamless theme integration.

• Spring-based entrance drawing physics for a fluid page-loading experience.

• Customizable center text flip transitions for smooth, physics-driven data reveals.

• Native keyboard focus handling and ARIA label routing for strict screen-reader accessibility.

• Structured property panels and intuitive labels for executing clear, friction-free design customizations.

How to Use

• Drag and drop the component onto your Framer canvas.

• Define your data segments by inputting values.

• Publish your project to view your component live.

Turn raw data into a highly polished, interactive experience.