We use cookies to enhance your experience. By clicking "Accept," you consent to the use of all cookies. Learn more in our policy.
Learn how to make a pie chart the right way—prepare your data, pick the perfect layout, apply readable colors, and embed it directly into Notion using Blocky. Includes accessibility tips, styling ideas, and concrete best practices.
I’ve built hundreds of charts, and I’ll level with you: a pie chart can be crystal clear or completely confusing. The difference? Thoughtful data prep, restrained styling, and an embed flow that fits your workflow. In this guide, I’ll show you how to make a pie chart that’s readable, beautiful, and ready to drop into Notion with Blocky—fast.
You’ll see exactly when a pie chart shines, how to avoid classic traps, and how to style it so the story pops at a glance. We’ll end by embedding it in Notion with a single block and a share link. Let’s make your data make sense.
A pie chart is best when you’re showing parts of a whole and the total equals 100%. Think market share, budget distribution, or device usage split. Keep slices few (ideally 3–6). The goal is quick perception, not forensic analysis. When shares are close together or there are many categories, bar charts usually outperform pies for accuracy and scanning. See why many UX pros default to bars or lines for nuance? Nielsen Norman Group explains the context behind chart choices clearly.
There’s also a human-perception wrinkle: people are worse at judging angles than lengths, so comparing similar slices is harder than comparing bars. That’s why pies with many tiny slices—no matter how pretty—get hard to read. A solid primer on these limits is the “caveat” note from Data to Viz, which sums up the tradeoffs.
Start with a table of 2 columns: Category and Value. One row per slice. Make sure values are numeric and positive. If your source data doesn’t sum to 100%, that’s fine—your charting tool will calculate proportions automatically.
Next, prune noise. Combine long tails of tiny categories into an “Other” slice so the core story stands out. A good rule of thumb? If a slice is under ~3% and there are several of them, bundle them. Then call it out in the caption: “Other combines 8 small categories under 3% each.” That small line saves your readers from whiplash.
Blocky makes Notion-ready widgets—charts, timers, study tools—on purpose. Here’s my quick build flow for a pie chart:
To embed in Notion, open your page, type /embed, and paste the Blocky link. That’s it—your chart loads, stays synced, and looks consistent with the rest of your Blocky widgets. Notion’s own docs confirm the flow for embeds if you need a refresher. Notion Help: Embeds.
Start with hierarchy. Your title should answer what the pie represents and when. Keep it short, specific, and scannable. Use the caption for context—assumptions, definitions, or how you calculated “Other.”
Then, tame the palette. Pick one accent slice (the hero of your story) and demote the rest with a cohesive set of related hues at lower saturation. Avoid rainbow explosions; they look fun but force the eye to decode a new color for every category. If two shares are similar, don’t rely on color alone—use labels, values, or a short note to clarify the comparison. Datawrapper’s guides showcase how cleaner color choices boost legibility in pies.
A great pie chart is inclusive by default. Text (titles, labels, legends) should meet WCAG contrast ratios—generally 4.5:1 for normal text and 3:1 for large text—to achieve Level AA. That keeps labels readable against light or dark backgrounds across devices. See W3C’s guidance and trusted primers for specifics.
Don’t communicate meaning with color alone. Pair color with text labels or percentages. Some readers won’t distinguish reds and greens; titles and direct labels help everyone. If you must show many categories, consider a different chart or a small multiples layout. Even accessibility reports and case studies caution that pies can fail fast when contrast is poor or labels are disjointed—so test your design.
Direct labels reduce eye gymnastics. Put the value next to the slice, not miles away in a legend. If your slices are thin, place labels just outside with graceful leader lines. Keep decimals sparing—percentages don’t need four places of precision. Round intelligently (e.g., 12.3%, 7.8%, 5.1%) so your story stays believable and neat.
Legends still have a place. If labels overlap or the chart gets crowded, switch to a clean legend aligned to the left or right. Sort the legend by slice size to match reading order, and consider bolding the most important category. Consistency beats cleverness.
Sort slices by size descending, starting at the 12 o’clock position. That layout helps readers scan from the largest contribution to the smallest, just like reading a ranked list. Place the hero slice at the top-right or top-left to meet reading patterns in left-to-right languages.
The “Other” slice belongs at the end. If it’s big, it’s a clue your underlying categories might need regrouping. When in doubt, promote a frequently discussed sub-category out of “Other.” Your stakeholders will thank you.
Your pie chart should survive both light and dark themes. Build a paired palette up front: one for light backgrounds, one for dark. Keep the hero hue identical and shift supporting slices slightly for tone. Test contrast for labels on both.
Working with brand colors? Take the core palette, then derive tints and shades that still meet contrast requirements. In Blocky, save this as a reusable theme so every chart—pie, bar, line—speaks your brand fluently. That consistency adds polish without extra work.
Interactivity is where a pie chart gets useful. On hover, show the exact percentage and absolute value. Add short tooltips like “Includes Canada + Mexico” when a label would get too long. If you’re presenting in a live session, consider a subtle “explode” effect on the hero slice to draw attention.
For dashboards, filters are gold. Let readers limit to a segment (e.g., region, plan type) or toggle between “% of total” and raw counts. If your audience needs to compare many categories or time periods, add a small multiples view or pair the pie with a companion bar chart. UX research consistently shows bars are better for close comparisons—save the pie for the quick split.
Once your chart looks right in Blocky, click Publish and copy the share link. Head to the Notion page where you want the chart. Type /embed, paste the link, press Enter. Resize the block to your preferred width. That’s the whole flow—no code, no iFrames to wrangle, and your chart stays updated as your data changes. Reference: Notion Help: Embeds.
Want to keep building? Blocky’s widget catalog includes timers (countdown, Pomodoro, world clock), study tools (habit tracker, flashcards, progress bars), and creative boosters (mood tracker, quotes, streaks). Your Notion can become a live dashboard, not just a static doc.
Too many slices. If you’ve got more than 6–7 categories, consider a bar chart or group tiny categories into “Other.” Your audience will process the message much faster.
No labels, weak contrast. A pie without labels is a guessing game. Add direct labels with short names + percentages, then verify contrast ratios for legibility in light and dark modes. WCAG’s 4.5:1 guideline for normal text is your north star.
Imagine this raw table: 12 marketing channels with tiny spends. First, sum the small ones under 3% into “Other.” Second, rename labels to be human (“Paid social” instead of “PS_Mixed”). Third, sort by spend. Fourth, choose a calm palette with one accent on “Email” if that’s your hero.
In Blocky, map Channel → Labels and Spend → Values. Enable labels with percentages. Add a caption: “Other combines 7 channels under 3% each.” Finally, embed in Notion. You just created a pie that reads itself.
Dual display: value + % If your stakeholder cares about dollars and percentages, show both in labels: “$124k (21%)”. Keep it short; long labels kill clarity.
Responsive rules On mobile, allow labels to switch to percentages only and rely on a tidy legend beneath. Then restore fuller labels on desktop. Datawrapper’s articles show several patterns for small screens if you want inspiration.
Is a donut chart better than a pie chart? Donut charts create an inner space for a total or KPI. They can improve label placement, but they don’t solve the “too many slices” problem. Choose whichever helps your readers grasp the split without squinting.
Should I label inside or outside the slices? Inside if space allows. When slices are thin, put labels outside with short leader lines. Don’t let labels overlap—reduce decimals or abbreviate names instead. Your goal is minimum friction.
Publish your first version and observe. Are people asking “what’s the total?” Add it in the center (donut) or as a subtitle. Are they confused about categories? Tighten labels, re-sort slices, or rebuild as a ranked bar chart. Keep an eye on accessibility and device testing. The small refinements are where a professional chart separates itself from a passable one.
And because Blocky keeps your Notion embeds in sync, iteration is painless. Update in Blocky, refresh in Notion, keep moving.
“How to make a pie chart” sounds simple. But making one that persuades—fast, fair, accessible—takes intention. Limit slices. Label clearly. Respect contrast. Highlight only what matters. Then embed directly in Notion with Blocky so the chart lives where your team works.
Treat this as your repeatable playbook. With it, your next pie chart won’t just look good—it’ll work.
Timers, charts, habit trackers, and more — all customizable and ready to embed in your Notion dashboard today.