What Colors Should You Use in Pie Charts? | Choosing Colors That Make Categories Easy to Distinguish

A pie chart shows how categories contribute to a whole, usually expressed as 100%. Adding a bright color for every new category can make similarly sized slices and small portions harder to identify. This guide explains how many colors to use, how to distinguish neighboring slices, and how to label categories and percentages clearly.

Use one color per category, but simplify crowded charts

Giving each category a distinct fill is a useful starting point, but more colors do not automatically improve understanding. Try a layout with around three or four categories first. If numerous tiny slices make the chart crowded, consider combining categories only when that preserves their meaning, or switch to a bar chart.

Compare the brightness of colors as well as their hue (the basic color family, such as red or blue). In a pie chart, every slice meets other slices. Different hues can still have similar brightness, making their boundaries difficult to detect. Try dark, medium, and light colors together, then judge the divisions rather than the palette alone.

Treat color as one way to locate a category, not the only source of its meaning. Show each category name with its percentage. When possible, place ‘Category – percentage’ near its slice instead of forcing readers to repeatedly match colors with a distant legend.

An example palette for three pie-chart categories

Imagine a fictional website reporting traffic sources: Search 55%, Social media 30%, and Referrals 15%. Use white ■#FFFFFF for the page background and dark blue-gray ■#273746 for category names and percentages. Their text contrast ratio is about 12.20:1. A HEX code is a hexadecimal notation used to represent a color.

Assign deep navy ■#10273D to Search 55%, warm brown ■#AA612B to Social media 30%, and pale cream ■#F8EBD2 to Referrals 15%. These colors vary in lightness as well as hue, rather than depending on hue differences alone.

The contrast ratio between neighboring slices is about 3.23:1 for navy ■#10273D against brown ■#AA612B, about 4.00:1 for brown ■#AA612B against cream ■#F8EBD2, and about 12.91:1 for cream ■#F8EBD2 against navy ■#10273D. Because all three slices of this pie touch the other two, check all three pairs.

The pale cream ■#F8EBD2 slice, however, contrasts with the white ■#FFFFFF page background by only about 1.18:1. Add an outer outline in deep navy ■#10273D so the shape of the light section remains identifiable. Text inside a colored slice may be hard to read against that particular fill, so placing labels outside the pie in dark blue-gray ■#273746 on white is a more consistent choice.

Present labels such as ‘Search 55%’, ‘Social media 30%’, and ‘Referrals 15%’ in a consistent arrangement. Do not squeeze a long label into a small 15% slice. Use a leader line or a category-by-category list beside the chart when space is limited.

Check boundaries and labels without relying on color alone

WCAG (Web Content Accessibility Guidelines) 2.2 Level AA, a defined web accessibility conformance level, specifies at least 3:1 contrast against adjacent colors for graphical parts needed to understand the content. Ordinary text generally requires at least 4.5:1 against its background. The figures in this example are calculated for the specified opaque colors; they do not guarantee that the complete rendered chart will be easy to interpret across color-vision differences or with very thin outlines.

Colors that appear distinct on one screen may be harder to separate on another device or for people with different color vision. On narrow mobile screens, change the label layout or show a table of values alongside the chart. Choose a pie chart when proportions of a whole are the main point; if readers must compare small numerical differences between many categories, consider a bar chart instead.

HueRoll lets you enter a HEX code, explore lighter and darker shades and palette suggestions, and compare the selected color against white or black. It does not automatically calculate contrast between two arbitrary colors or determine Level AA compliance. Check neighboring slice colors separately and make every category identifiable through both its visual treatment and its label.