Font Size Input
Select Screen Size
Check Contrast Ratio
Live Preview
The quick brown fox jumps over the lazy dog. This sample text demonstrates how your font size appears on the selected screen size.
Accessibility Analysis
Readability
Good readability for most users
Touch Target
May need larger tap targets on mobile
Scaling
Scales well across devices
WCAG Compliance
Meets WCAG 2.1 guidelines
Suggested Alternatives
Accessibility Guidelines
1.4.4 Resize Text (Level AA)
Text can be resized without assistive technology up to 200% without loss of content or functionality.
1.4.8 Visual Presentation (Level AAA)
For ideal readability: line height at least 1.5× font size, paragraph spacing at least 2× font size, and max line width of 80 characters.
1.4.10 Reflow (Level AA)
Content should reflow without horizontal scrolling at 320px width (mobile) and 256px height (desktop).
1.4.12 Text Spacing (Level AA)
No loss of content when: line height ≥1.5×, paragraph spacing ≥2×, letter spacing ≥0.12×, word spacing ≥0.16×.
Minimum Font Sizes
- Body text: 16px minimum (recommended: 18px)
- Secondary text: 14px minimum
- Captions/labels: 12px minimum
- Legal/fine print: Never below 10px
Responsive Typography
- Use relative units (rem, em) instead of pixels
- Implement fluid typography with clamp()
- Test at 200% zoom level
- Ensure text remains readable when enlarged
Line Length & Spacing
- Optimal line length: 45-75 characters
- Line height: 1.4-1.6 for body text
- Paragraph spacing: 1.5× line height
Mobile Devices
- Small: 320-375px (iPhone SE, older phones)
- Medium: 375-414px (iPhone X, most Android)
- Large: 414-428px (iPhone Plus, Max models)
Tablets
- Portrait: 768px (iPad)
- Landscape: 1024px (iPad)
- Large tablets: 1024-1366px (iPad Pro)
Desktops
- Small laptop: 1024-1280px
- Desktop: 1440px (common)
- Large desktop: 1920px+