Pick a dashboard series color for a slide deck
Sample a dashboard color, copy its HEX or RGB value, and use it consistently in slide charts without guessing or confusing nearby shades.
You are turning a dashboard into slides and want a chart series to use the same color. Picking by eye can leave you with a shade that is close, but not quite right, especially when several series sit next to each other.
Use the Color Picker to sample a color from your screen and get its HEX, RGB, and HSL values. Then apply that value to the matching series in your slide deck.
Sample the dashboard color
- Open the dashboard and make sure the series color is visible as a flat, solid area. On a computer, open the Color Picker in Chrome or Edge. Its pick-from-screen feature works in those browsers. Other browsers may offer a reduced version or no screen picking.
- Use the tool’s screen-picking action to sample the center of the series color. Avoid its border, a thin line, or a small marker, since nearby background pixels can affect what you sample.
- Read the HEX value and note it beside the series name, such as “Revenue, #2878B5.” The tool also shows RGB and HSL values if your slide editor asks for one of those formats.
- Repeat for each series you need. Keep the series name with each value so you do not accidentally assign one category’s color to another.
- In your slide editor, open the chart’s series formatting controls and enter the sampled color as the fill or line color. The exact menu names vary by editor, so look for the formatting options for the individual data series, not the whole chart.
For the cleanest sample, use a dashboard with the same theme and color settings you intend to reference. If the chart is very small, zoom in before sampling, but target the center of a solid section rather than an edge.
Understand the color values
HEX is the easiest value to save
A HEX value looks like #2878B5. It is a compact way to describe a screen color, and many slide editors accept it directly. Copy all six digits after the hash mark, and keep the hash if the editor expects the full format.
RGB describes red, green, and blue
RGB values give the amount of red, green, and blue in the color, often as three numbers from 0 to 255. Use this format if the slide editor provides separate fields for those channels. The RGB and HEX versions represent the same color when entered correctly.
HSL describes hue, saturation, and lightness
HSL can help when you want to make a color lighter or less intense while keeping its general hue. It is useful for designing a related set of colors, but it is not necessarily the format your slide editor requires. Start with the sampled HEX value if you want the closest visual match.
A match on screen is not a print guarantee
The picker reports the color displayed on your screen. A projector, a different monitor, or printed output can make the same value look different. Treat the sampled value as a reliable starting point, then inspect the actual slide on the screen or projector you will use.
Choose colors for every series
Keep series colors consistent
If a series appears on several slides, use the same color each time. For example, keep the same shade for the same product or time period instead of assigning a new color to make each chart look different. Readers can then recognize the series without having to relearn the legend.
Make neighboring series easy to tell apart
Two colors can have different HEX values and still look nearly identical in a busy chart. Check the colors side by side at the size they will appear in the presentation. If they are hard to distinguish, adjust one of them or choose a more separated hue. Avoid relying only on red versus green to communicate a difference, since some viewers have trouble distinguishing that pair.
Check the slide background
A color that is clear on a white dashboard may fade against a white slide, and a dark series may disappear on a dark background. Preview the chart on its actual slide background. Use a darker or lighter shade if needed, and keep text and data labels readable.
Use more than color when the distinction matters
For an important comparison, reinforce color with direct labels, different line patterns, or distinct markers. This helps when a slide is projected poorly, viewed in grayscale, or seen by someone who cannot easily distinguish the colors. Do not make the legend the only way to identify a key line if you can label the series clearly.
Fix a sampled color that looks wrong
- Sample the flat center again. A chart edge blends with nearby pixels on screen, so the sampled value may not match the intended series. Try a wider part of the same color.
- Check for transparency or effects. A dashboard may show a color through transparency, shading, or a gradient. Sample a solid section if one is available, or choose a single solid color for the slide chart.
- Confirm the correct series is selected. If only one line or group of bars changed, check that you formatted the intended series rather than the chart background or another data series.
- Compare on the presentation display. If the value looks right in the editor but wrong when projected, adjust the shade for visibility while keeping it recognizable as the same series. A perfect screen-value match matters less than a chart people can read.
Why nearby pixels can differ
Thin chart lines and text edges are often smoothed by the browser. This creates blended pixels between the series color and its background, so sampling an edge can return a color that is not the original series color. A solid legend swatch or the center of a wide bar is usually a better target.
Also check the chart after changing themes or switching between light and dark mode. The dashboard may use a different series shade in each theme, so sample the version that best matches the slide you are preparing.
