Loading...
A type scale is a structured system of font sizes, weights and line heights that creates a clear visual hierarchy. It ensures text is readable, consistent and visually aligned across all devices and screen sizes.
The NSW Government type scale is based on the 8-point grid system. This approach supports proportional spacing and sizing, helping designers maintain alignment and rhythm across email and web layouts.
Display – large sets the visual tone and should be reserved for the most prominent message in your email. Use a strong contrasting colour and ensure ample spacing around the text for readability across screen sizes.
Use sparingly for high–impact announcements or campaign headers.
Display – medium supports hierarchy while maintaining balance within the layout. Avoid using it too frequently to prevent visual clutter.
Ideal for section introductions or featured content.
This size provides distinction without overpowering body text. Use it to lead into secondary content or highlight a quote or key takeaway. It can also provide emphasis within content blocks or callouts.
Headline – large is typically used at the start of a main section. Ensure it follows logical hierarchy and avoid using more than once per screen.
It is used as the primary heading style for structuring long-form email content.
Headline – medium creates clear breaks between content areas and supports scanability, particularly on mobile.
It is used for sub-sections within the email layout.
Use this for nested content (content placed within another content block), or to label grouped items like FAQs or linked resources. It maintains clarity while providing strong typographic contrast from body copy.
Designed for introductory text or summary paragraphs at the top of an email. This size supports easier reading on all devices and works well in accessibility-first layouts.
Default size for general copy across the email. Body style ensures legibility and supports screen readers. Maintain line height around 1.5 for optimal readability and use left alignment.
Used for less prominent content such as disclaimers, footnotes or supporting details. Avoid using small text for important messages or links, especially in mobile view.
Reserved for legally required content or technical metadata in the email footer. Always check contrast and avoid placing on dark backgrounds unless WCAG contrast is met.
Use for UI elements such as buttons, tags or field labels. Labels should remain short and functional, and text must be clear when viewed at smaller resolutions or in dark mode.