# Atlassian Typography Cheatsheet

> Practical rules and ratios for type scale, line height, and length

A concise typography reference created by Atlassian covering essential formatting principles. It provides specific formulas and baseline numbers for establishing typographic scale, heading versus body line heights, and comfortable line lengths.

## The framework

Typography cheatsheet (by Atlassian)

TYPESCALE

Sample sizes: 48px, 40px, 32px, 28px, 24px, 20px, 16px, 14px, 12px. Work down from a base size; scale ratio example: 16 x 1.2 = 19.2 → round to 20.

LINE HEIGHT

Heading font size x = 24 → ~1.2x = 28.8 → line height 28.

Body font size x = 16 → ~1.5x = 24 → line height 24.

Rule of thumb: headings ~1.2x font size, body ~1.5x.

LINE LENGTH

Too short: lines of ~3–6 words force constant line breaks and chop the reading rhythm.

Optimal length: roughly 50–75 characters per line, comfortable reading rhythm.

Too long: lines running far past that strain the eye tracking back to the next line.

Context from the tweet: three core principles every designer should get right — 1) Type Scale, 2) Line Height, 3) Line Length. "Good typography is invisible, but bad typography is painfully noticeable."

## What it is for

- Calculate consistent line heights for headings and body text
- Establish a modular type scale for a design system
- Set readable paragraph line lengths in responsive layouts

## Key points

- Standard modular type scale values ranging from 12px to 48px
- Mathematical scale ratio rounding guidelines
- Heading line height formula of approximately 1.2x font size
- Body line height formula of approximately 1.5x font size
- Optimal reading line length recommendation of 50 to 75 characters per line

## Pricing

Free

## Details

- Type: Framework
- Category: [Design](https://xiry.app/topics/design.md)
- Open source: no
- Platforms: other
- For: UI/UX designers, design system engineers, and frontend developers
- Tags: typography, design system, ui design, cheatsheet, atlassian

## Why it was saved

- [@101babich, 6 July 2025](https://x.com/101babich/status/1941790119125463537): Concrete, reusable rules for type scale, line height, and line length with exact calculations.

## Related

- [iOS UI Font Size Rules & Reference](https://xiry.app/resources/ios-ui-font-size-rules-and-reference): A reference guide to typography rules and sizes for iOS interfaces. (Tip, Free)
- [Mobile App Typographic Hierarchy Guide](https://xiry.app/resources/mobile-app-typographic-hierarchy-guide): A practical font sizing and hierarchy framework for mobile UI design. (Tip, Free)
- [Minimal Product Design Cheatsheet](https://xiry.app/resources/minimal-product-design-cheatsheet): Quick typography, color palette, and iconography reference for clean product interfaces. (Tip, Free)
- [ABER MONO](https://xiry.app/resources/aber-mono): A clean, modern monospaced typeface with technical styling (Free)
- [Craft](https://xiry.app/resources/craft): A collection of design engineering concepts and practical UI craft lessons (Website, Open source)
- [Design System Checklist](https://xiry.app/resources/design-system-checklist): Open-source interactive checklist for planning, building, and maintaining design systems (Website, Free)

Updated 11 October 2026. Page: https://xiry.app/resources/atlassian-typography-cheatsheet

Make your own library: Xiry takes your saved reels, tweets, Reddit bookmarks and Watch Later videos, makes them searchable and pulls the useful stuff out, like this library. It's invite-only for now; join the waitlist at https://xiry.app/#waitlist.
