This Rive component was designed to be a flexible and data-driven asset for dashboards, reports, or onboarding flows.

Designed for modern interfaces, the component includes built-in 'Light' and 'Dark' modes. This is handled by switching between dedicated Rive artboards, making it simple to integrate into any application's theme.

The visualization is 100% responsive. The Rive artboard scales fluidly, ensuring the graphic and its data are clear, legible, and perfectly proportioned on any device, from a mobile dashboard widget to a full-width desktop report.

A key goal for this component was deep customizability, allowing it to be a truly reusable asset.

Dynamic Styling: The component's color palette is not static. Key visual elements, such as the glow of the "Optimized" column and other accents, are tied to a 'root color' input in Rive. This allows for instant rebranding or theme adjustments, enabling the component to seamlessly fit into any design system.

Dynamic Content: All text elements are dynamic. The metric labels (e.g., 'Optimized Result', 'Industry Average') and their corresponding percentage values are all linked to Rive inputs. This allows the animation to be populated with real-time data from any source.