How to pick a neutral UI gray for a slide deck

A gray that looks neutral in a color menu can look blue, green, or brown once it fills a slide. The surrounding colors, screen settings, and room lighting all affect how you see it.

Use a gray with balanced color values as a starting point, then check how it works in the actual deck. The Color Picker can sample a color on your screen and show its HEX and RGB values, so you can inspect a reference or verify a candidate.

Pick a starting gray

1. Open the Color Picker in Chrome or Edge on a computer. Its screen color sampling works in those browsers; other browsers may offer a reduced version or none.
2. Choose what the gray will do. A slide background needs to leave text and images clear. A panel or card can be a little darker than the background, while a border usually needs only enough contrast to mark an edge.
3. Start with a candidate in your slide editor. For a light background, try #F2F2F2 or #F5F5F5. For a slightly darker panel, try #E8E8E8. These are starting points, not rules.
4. Sample the candidate on the screen and read its RGB values. For a neutral gray, the red, green, and blue values should match, such as RGB 242, 242, 242 for #F2F2F2. If the numbers differ, the color has a tint.

The Color Picker reads the color that is displayed on screen. It does not create or apply a gray for you, so enter a candidate in your slide editor first, or sample a gray already on screen to inspect it.

Choose a gray for each slide element

For the main background

Use a very light gray if pure white feels too bright or stark. A value such as #F5F5F5 keeps the background close to white while making white cards or images easier to distinguish. If the slide has several photos, charts, or colored blocks, a simple pale gray usually stays out of their way.

For cards and panels

Separate a panel from its background with a small but visible change in brightness. For example, pair a #F5F5F5 background with an #E8E8E8 panel. If that difference disappears on your screen, try a darker panel or add a border. Avoid adding a blue or tan tint just to make the panel feel more distinct.

For borders and dividers

Use a middle gray that is easy to see against both the panel and its surroundings. A very light border can disappear on a projector, while a near-black border can make a clean layout look heavy. Check thin lines at the size they will appear during the presentation, not only while zoomed in.

For text

Do not use a pale gray for small text on a pale gray background. Use a much darker color, such as #333333, for body text and labels. As a general accessibility check, aim for a contrast ratio of at least 4.5:1 for normal text and 3:1 for large text. The Color Picker reports color values, not contrast ratios, so use your slide software's contrast checker if it has one.

Check the gray in the finished slide

Place the gray beside the colors it will actually sit next to. A gray can look neutral beside white but noticeably cool beside cream, or warm beside a blue background. Include a heading, body text, a panel, and any accent color in the comparison instead of judging a color chip alone.

• Look for a color cast. Equal RGB values describe a neutral gray in the color value, but your screen, color profile, and nearby hues can still make it appear tinted. If it seems blue or beige, compare it with a plain neutral reference on the same display.
• Check the contrast. Make sure text and important boundaries remain clear at normal presentation size. If viewers need to squint, darken the text or increase the difference between the background and panel.
• Preview on the presentation display. A projector or another monitor may show the same HEX value with different brightness or color. Check a test slide on the equipment you plan to use when possible.

Why neutral gray can still look different

HEX and RGB values describe the color sent to the display, not a guarantee of how every screen will look. Brightness, night modes, color profiles, projector settings, and room light can all change the appearance. A neutral value is a reliable starting point, but the slide should still be checked on its intended display.

Keep a note of the chosen HEX value in your deck's style guide so you can reuse the same gray instead of selecting a close-looking shade on each slide.