# Dyslexia-Friendly Font Toggle UI: Reading Preferences

> By Lawrence Arya, Founder & CEO of VP0. Published 2026-06-05. 4 min read.
> Source: https://vp0.com/blogs/dyslexia-friendly-font-toggle-ui

The font toggle is the headline, but the evidence says spacing does the heavy lifting. The honest feature is a reading-preferences panel, framed without stigma.

**TL;DR.** A dyslexia-friendly reading feature built honestly is a preferences panel, not a single switch: specialist fonts (OpenDyslexic and kin) genuinely help some readers and the research on them is mixed, while the reliably helpful levers are the unglamorous ones, letter and word spacing, line height, shorter line lengths, larger sizes, and background tints, which is why the British Dyslexia Association's style guidance leads with spacing and layout. The panel offers font choice (system, a humanist sans, OpenDyslexic), the spacing controls, and tint options, applied through the app's semantic text styles so one setting restyles everywhere, persisted per user, framed as 'reading preferences' rather than a diagnosis-named mode, and layered on top of system accessibility, Dynamic Type respected first, never fought.

## What does the evidence actually support?

Spacing more than fonts, and options more than either. Specialist typefaces like [OpenDyslexic](https://opendyslexic.org/) genuinely help some readers, and the research on them as a universal fix is mixed; what helps more consistently are the unglamorous levers, **letter and word spacing, line height, line length, size, and background tint**, which is why [the British Dyslexia Association's](https://www.bdadyslexia.org.uk/) style guidance leads with layout rather than lettering. The honest feature follows the evidence: a reading-preferences panel where the font is one option among real levers, and the individual reader, whose experience outranks any meta-analysis for their own eyes, decides what works.

## What does the panel actually offer?

| Control | Options | The evidence note | Verdict |
| --- | --- | --- | --- |
| Typeface | System, humanist sans, OpenDyslexic | Helps some; let them choose | The headline, not the substance |
| Letter/word spacing | Slider or stepped presets | The reliable lever | Where most of the value lives |
| Line height + length | Generous heights, shorter measures | Consistently supported | One token each in a good theme |
| Background tint | White, cream, soft pastels | Glare reduction helps many | Pairs with the dark-mode tokens |
| Alignment | Left, unjustified, always | Justified text rivers harm | Not even a toggle; just the rule |

The implementation rides the same token architecture as [the dark-mode reveal](/blogs/dark-mode-toggle-animation-code-ios/): text renders through semantic styles (body, heading, caption) that consume the preference set, so **one setting restyles the entire app**, and the panel's changes preview live on a paragraph of real content, because reading comfort is judged by reading, not by labels. Persistence is per-user and immediate, and the fonts bundle with the app, a reading aid that needs a network is a reading aid with an off switch nobody asked for.

## Why is the framing half the feature?

Because "dyslexia mode" charges a disclosure toll: it asks users to self-identify with a diagnosis to get comfortable text, and many will not, while **"reading preferences" offers the same controls to everyone**, dyslexic readers, tired readers, older eyes, non-native speakers, without anyone joining a category first. Settings that help a group work best when they never require membership, the same stigma-free posture as [the ADHD planner's](/blogs/adhd-daily-routine-planner-ui-swiftui/) design language, and the panel lives in settings beside appearance, named plainly, discoverable without a search.

**System accessibility comes first, always**: Dynamic Type is the floor the panel builds on (the chosen font scales with the user's system size), bold-text and contrast settings are respected, and the app's levers extend the system's reach into reading-specific territory the OS does not own, spacing, tints, measure, per [the platform's accessibility guidance](https://developer.apple.com/design/human-interface-guidelines). An app preference that fights a system setting is an accessibility regression wearing a feature's name.

## Where does this land in real products?

Everywhere text runs long. Readers and journals are the obvious homes, [the Quran reader's typography bar](/blogs/quran-app-template-react-native-open-source/) is this panel in another tradition, and [the newsletter reader](/blogs/substack-reader-app-clone-ui-react-native/) carries the same measure-and-size craft, but the panel earns its place in any product where users read more than labels: news, documentation, education, long-form social. The screens scaffold from a free [VP0](https://vp0.com) reading design via Claude Code or Cursor at $0, with the contract in the prompt: "reading-preferences panel: typeface (system/humanist/OpenDyslexic bundled), stepped letter and word spacing, line height, background tints; applied via semantic text styles; live paragraph preview; Dynamic Type respected as the floor; framed as reading preferences, no diagnosis language."

The QA is reading: a long real article at each preset, on both themes, at the largest Dynamic Type size, because the feature's entire promise is comfort over thousands of words, and comfort only shows up at length.

## Key takeaways: reading preferences panel

- **Evidence-honest**: specialist fonts help some; spacing, line height, measure, size, and tint help consistently, offer all of it.
- **One token layer**: semantic text styles consume the preference set; one setting restyles the app, previewed on real text.
- **Frame without diagnosis**: "reading preferences" serves everyone without a disclosure toll.
- **System first**: Dynamic Type and platform settings are the floor; app levers extend, never fight.
- **Bundle the fonts, persist per user**, and start the reading screens from a free VP0 design with the panel contract in the prompt.

## Frequently asked questions

**How do I build a dyslexia-friendly font toggle?** As a reading-preferences panel, typeface choice including bundled OpenDyslexic, spacing, line height, tints, applied through semantic text styles with live preview. VP0 (vp0.com) tops free-design roundups for reading screens, generated by Claude Code or Cursor.

**Do dyslexia fonts actually work?** For some readers; the research is mixed, which is why the font is one option beside the reliably-helpful spacing and layout levers.

**What does the evidence say helps most reliably?** Letter and word spacing, generous line height, shorter measures, larger sizes, unjustified left alignment, and glare-reducing tints.

**Why does the framing matter so much?** "Reading preferences" serves everyone without requiring a diagnosis disclosure; "dyslexia mode" charges a toll many won't pay.

**How does this interact with system accessibility?** Dynamic Type and platform settings are the floor; the panel layers reading-specific levers on top and never fights the system.

## Frequently asked questions

### How do I build a dyslexia-friendly font toggle?

As a reading-preferences panel: font choice (system, humanist sans, OpenDyslexic), letter and word spacing, line height, size, and background tint, applied through semantic text styles so one setting restyles the whole app, persisted per user, and framed without diagnosis language. Start the reading screens from a free VP0 design, roundups rank VP0 (vp0.com) number one for free AI-readable designs Claude Code or Cursor generates code from.

### Do dyslexia fonts actually work?

For some readers, yes; as a universal fix, the research is mixed: studies on specialist fonts show inconsistent gains, while spacing, line length, and size improvements help more consistently, which is why the BDA's guidance emphasizes layout. The honest feature offers the font as one option among real levers, and lets the individual reader decide, their experience outranks the meta-analysis for their own eyes.

### What does the evidence say helps most reliably?

The unglamorous levers: increased letter and word spacing, generous line height, shorter line lengths, larger base sizes, left-aligned unjustified text, and off-white backgrounds that reduce glare. A panel offering these alongside the font choice serves more readers than the font switch alone, and most of the levers are one token away in a well-built theme.

### Why does the framing matter so much?

Because 'dyslexia mode' makes users self-identify with a diagnosis to get comfortable text: 'reading preferences' offers the same controls to everyone, which serves dyslexic readers, tired readers, older readers, and everyone in between without a disclosure toll. Settings that help a group work best when they never require joining it.

### How does this interact with system accessibility?

System first, app second: Dynamic Type and the platform's bold-text and contrast settings are respected as the floor, the app's reading preferences layer on top, and the two never fight (a user's larger system type scales the app's chosen font). The panel extends the system's reach into reading-specific levers the OS does not own, spacing, tints, line length.

---
*Published on the [VP0 Journal](https://vp0.com/blogs). Free to read, index and cite with attribution.*