Pie Chart
A customizable pie chart for Framer with smooth animations, tooltips, and responsive design — perfect for visualizing data proportions with style and clarity.
Made with Workshop
Build your own component with AI
A professional and fully customizable pie chart for Framer — perfect for visualizing proportional data, survey results, market share, or any dataset where parts of a whole need to be shown. Built with Chart.js, it offers smooth animations, interactive tooltips, and a flexible legend system for clean data presentation.
✨ Features
Interactive data display with hover tooltips
Flexible input: add data manually with labels, values, and colors
Customizable title with full font styling, alignment, and color options
Adaptive legend with bottom or right positioning
Segment outline color and width controls
Smooth entrance animations with easing effects
Fully responsive and adapts to container size
Background, border radius, and shadow appearance controls
Adjustable spacing between title, chart, and legend
Optimized for performance with smart animation handling
📌 How to Use
Drag the component onto your canvas and resize as needed
Add your data: each entry requires a label, value, and color
Customize the title, legend, and tooltip settings in properties
Adjust colors, outline, spacing, and appearance to match your design
Toggle animations on or off for your preferred effect
This component automatically validates data, adapts responsively, and ensures smooth performance, making it a reliable choice for dashboards, reports, and presentations.
