Android bold text app comparison

Do you know what your designs look like when people turn on bold text on their phone?

Published in

Bootcamp

4 min readOct 25, 2023

Android has a setting that lives within Settings > Display > Display size and text, which allows users to change the default font size. iOS has a similar feature if you go to Settings > Display & Brightness or Settings > Accessibility > Display & Text Size.

According to Appt.org, 9% of the 45% of Dutch iOS users, who enable at least one accessibility feature turn on bold text. For the 59% of Dutch Android users who enable at least one accessibility feature, 2% of them turn on bold text.

Very similar to High-contrast mode, bold text mode makes it easier to see certain fonts by making them less subtle.

I’ve taken a few screen shots to compare what changes when bold text is turned on.

Side-by-side comparison of the Display size and text settings screen in Android with Dark mode on. One has Bold text switched on and one does not. When Bold text is on, all text on the screen becomes bold, which means the space it takes up slightly increases

When Bold text is switched on, the font weight of all text is increased. This also effects the text inside buttons and other interactive elements.

Side-by-side comparison of the Display size and text settings screen in Android with Dark mode on. Both screens have increased Font size, Display size and High-contrast text switched on. One screen also has Bold text switched on, which causes some of the copy to wrap onto multiple lines

Design for flexible heights

In this comparison, Font size and Display size has been increased as well as High-contrast text being switched on. Notice how turning Bold text on causes some copy, which previously fit on one line to wrap onto multiple lines.

Switching Bold text on increases the weight of font, which means it will take up slightly more space on a screen. Always ensure your designs allow for items to increase in height. This means your content is available to everyone regardless of their preferences. You don’t want content being hidden behind other elements because everything is using fixed heights.

Side-by-side comparison of the Feedly app in Android with Dark mode on. One screen has Bold text switched on, however, both screens look identical because the app wasn’t built to respect the Bold text setting

Respect people’s preferences

In the comparison of the Feedly app, its obvious that the team didn’t build it to respect the Bold text setting, as nothing changes in the design. The screen on the right has Bold text turned on (which you can notice as the time at the top is bold).

It’s important to be aware of what settings people can change on their devices. You should always ensure your products respect people’s preferences, otherwise you’re excluding people. Work with your team to make sure your products are tested with settings such as Bold text switched on.

Side-by-side comparison of an empty basket page in the Amazon Android app. One screen has Bold text switched on, however, both screens look nearly identical. Only the placeholder text in the search bar and the tabs at the top of the screen respect the Bold text setting.

The Amazon Android app also does a poor job of respecting the Bold text setting. The only text that updates on an empty basket page is the search placeholder text and the text for the tabs at the top.

Things to consider when designing your product with bold text in mind

Test your designs with Bold text switched on to ensure an equitable experience across all user preferences
Design your products to be flexible, so if an element needs to increase in height it can do so without obscuring anything
Work with your developers to be sure your product respects the Bold text user setting