5d:I[333483,["/creators-assets/_next/static/immutable/chunks/356g_j0l71_46.js","/creators-assets/_next/static/immutable/chunks/15s1ft4k9lx-7.js","/creators-assets/_next/static/immutable/chunks/0x8sumr53pdkk.js","/creators-assets/_next/static/immutable/chunks/3pud1dqsw0-_7.js","/creators-assets/_next/static/immutable/chunks/1m75iqpnspynu.js","/creators-assets/_next/static/immutable/chunks/0c6romi9ma0is.js","/creators-assets/_next/static/immutable/chunks/3ohf-5_4hfjuq.js","/creators-assets/_next/static/immutable/chunks/2jjhfe7-w6y9a.js","/creators-assets/_next/static/immutable/chunks/325i2v5l4tnlq.js","/creators-assets/_next/static/immutable/chunks/0kisxyo3aw231.js","/creators-assets/_next/static/immutable/chunks/2b1mm8iiske-y.js","/creators-assets/_next/static/immutable/chunks/0i7m0zg6jfazw.js","/creators-assets/_next/static/immutable/chunks/3-hmotkz_bdv_.js","/creators-assets/_next/static/immutable/chunks/06bqtx1jsc1kz.js","/creators-assets/_next/static/immutable/chunks/3q5wansxm4vp6.js","/creators-assets/_next/static/immutable/chunks/14h9277o22-rl.js","/creators-assets/_next/static/immutable/chunks/3naniu4pnqfyw.js","/creators-assets/_next/static/immutable/chunks/2-y_r3u4wh2s3.js","/creators-assets/_next/static/immutable/chunks/456d4lcv9-syj.js","/creators-assets/_next/static/immutable/chunks/36-o7-3julke0.js","/creators-assets/_next/static/immutable/chunks/2xq6uu2rcdc2i.js","/creators-assets/_next/static/immutable/chunks/2y9gv91n8o3i9.js","/creators-assets/_next/static/immutable/chunks/41i4r4u9uolgz.js","/creators-assets/_next/static/immutable/chunks/02ciyo_cdpkrz.js","/creators-assets/_next/static/immutable/chunks/3e73rezw4k1a2.js","/creators-assets/_next/static/immutable/chunks/15q00pdqk0br3.js","/creators-assets/_next/static/immutable/chunks/293prjxu_wz0c.js","/creators-assets/_next/static/immutable/chunks/0l9v835j421-s.js","/creators-assets/_next/static/immutable/chunks/40oma2w708rd-.js","/creators-assets/_next/static/immutable/chunks/2x7-2b3jcc9x7.js","/creators-assets/_next/static/immutable/chunks/3_pg4jxj9aiiw.js","/creators-assets/_next/static/immutable/chunks/3k6sa9ujkqb5c.js","/creators-assets/_next/static/immutable/chunks/3l2h8slpbzxqo.js","/creators-assets/_next/static/immutable/chunks/2xgtw4s-tlhet.js","/creators-assets/_next/static/immutable/chunks/3b306xa-3tb7g.js","/creators-assets/_next/static/immutable/chunks/2fvzgkzqkig_w.js","/creators-assets/_next/static/immutable/chunks/3g6klxxyg4m8-.js","/creators-assets/_next/static/immutable/chunks/0qx5rzvbsd7bx.js","/creators-assets/_next/static/immutable/chunks/1cphzzg2t2qo2.js"],"PostDetailCard"] 5e:Tabc,

Smart Chart

Transform your data into stunning visual stories with this professional chart component. Perfect for dashboards, reports, presentations, and data-driven websites.

📈 Three Chart Types

Bar Chart

- Gradient-filled bars with rounded corners

- Value labels above each bar

- Responsive bar widths

- Lift animation on hover

Pie Chart

- Beautiful gradient slices with shadows

- Percentage labels inside slices

- Auto-generated legend

- Smooth hover animations

Line Graph

- Gradient color transitions between points

- Filled area under the line

- Grid lines for easy reading

- Glowing effect on hover

✨ Key Features

Easy Data Entry

- Add unlimited data points

- Set custom colors for each point

- Label and value for every entry

- No coding required

Full Customization

- Typography: Control fonts for title, subtitle, labels, and values

- Colors: Customize background, text, tooltips, and export button

- Display: Toggle labels, values, tooltips, and subtitle

- Accessibility: Built-in ARIA labels and descriptions

Export Anywhere

Export your charts in 5 formats:

- PNG & JPG - High-quality images

- SVG - Scalable vector graphics

- CSV & JSON - Raw data export

Responsive & Performant

- Adapts to any screen size

- Smooth animations

- Optimized SVG rendering

- Fast and lightweight

Professional Tooltips

- Shows label, value, and percentage

- Color-coded borders

- Follows mouse cursor

📊 Perfect For

- Marketing dashboards

- Sales reports

- Analytics presentations

- Portfolio websites

- SaaS applications

- Educational content

- Business presentations

- And more!

🚀 Easy Setup

1. Drag component to canvas

2. Click to open properties panel

3. Add your data points with colors

4. Customize fonts and colors

5. Toggle display options

6. Done!

5a:[["$","$L5d",null,{"post":{"id":"019a36a9-0503-7102-8b1a-84c078dcada0","title":null,"body":null,"bodyJson":null,"author":{"framerUserId":"72ae6994-b2fd-4d99-bb09-9da5afc28530","name":"Matou Spade","slug":"matou-spade","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/458418/avatar-nLgerePyBK4J28Se8MT87BZa8gFK4O.jpg","followed":false,"followsYou":false},"media":[],"resources":[{"id":"xUCwgvEJEsswdO7WCwKV","resolved":true,"title":"Smart Chart","body":"$5e","bodyJson":null,"introduction":"Transform your data.","slug":"smart-chart","author":{"framerUserId":"72ae6994-b2fd-4d99-bb09-9da5afc28530","name":"Matou Spade","slug":"matou-spade","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/458418/avatar-nLgerePyBK4J28Se8MT87BZa8gFK4O.jpg","followed":false,"followsYou":false},"media":[{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/components/xUCwgvEJEsswdO7WCwKV/smart-chart-DFc6BsLTMbXxRRAoxq7w0V80EwXMZg","metadata":{"tint":{"h":0,"s":0,"l":57},"width":1600,"height":1200}}],"post":null,"createdAt":"2025-10-21T17:30:14.416Z","updatedAt":"2026-03-28T08:59:25.033Z","publishedAt":"2025-10-30T19:47:17.891Z","featuredAt":null,"approvedAt":null,"type":"component","attributes":{"url":null,"previewUrl":"https://smartchart.framer.website/","price":"5","paymentUrl":"https://buy.stripe.com/7sY7sN63p4w8arw6dp2VG02","workshop":false,"categories":[{"id":"51314a1b-a5bd-4ae8-acf0-bd3d5058c367","name":"Charts","slug":"charts"}],"lastSaveId":"Dgu2bTs23qJngKRzwMH1","tags":[]}}],"contests":[],"categories":[],"tags":[],"likes":{"count":1,"liked":false},"comments":{"count":0},"reposts":{"count":0,"reposted":false,"repostId":null},"version":1,"edited":false,"editedAt":null,"createdAt":"2025-10-30T19:47:17.891Z","updatedAt":"2025-10-30T19:47:17.891Z","reported":false}}],"$L5f"]

Suggested for you