Agriculture Design System
Design System for import and export services

Text sizing and spacing

Ensure adequate text size and spacing. This improves readability and reduces eye strain for everyone, but it’s essential for people with low vision or dyslexia.

Text size and spacing in AgDS

We use WCAG conformant text size and spacing throughout the design system components, patterns, templates and documentation. You can use them to ensure your digital products and services are readable and understandable for a wide audience.

Our use of text size and spacing in our components and patterns achieved full WCAG conformance in accessibility audits in 2022 and 2024. Implementation of AgDS text size and spacing in our patterns is demonstrated in the yourGov application.

Requirements

Resizing

  • Text resizes up to 200% without loss of content or functionality.
  • Content reflows without horizontal scrolling at a width of 320px, except when two-dimensional scrolling is needed to understand content – for example, when a table is required.
  • When a table requires scrolling in both directions, the scrollbars are on the table, not the webpage.
  • Content doesn’t cut off or overlap when text is enlarged.

Spacing

Text must support text spacing adjustments:

  • Line height of at least 1.5 times the font size.
  • Spacing after paragraphs of at least 2 times the font size.
  • Letter spacing of at least 0.12 times the font size.
  • Word spacing of at least 0.16 times the font size.

Benefits

  • Improves readability for all users.
  • Accommodates users who need larger text to read comfortably.
  • Supports people using screen magnification.
  • Helps people with visual and cognitive disabilities who need more spacing.
  • Ensures content is usable on small displays and mobile devices.

WCAG references