The complete guide to digital menu board font size, contrast ratios, and layout standards that ensure every customer can read your menu.
---
Your menu boards look stunning on the design team's monitors. The typography is elegant. The layout is clean. The brand guidelines are perfectly executed.
There's just one problem: customers can't read them.
This is the invisible crisis in digital signage. Menus designed for aesthetics fail at their primary job—communicating what's available and what it costs. The result is confused customers, slower service, and lost revenue.
This guide provides specific, actionable standards for restaurant signage typography, contrast ratios, and layout density—ensuring your digital menus are as legible as they are beautiful.
---
---
Why Designers Get This Wrong
Graphic designers working on digital menu projects face a fundamental problem: they design on high-resolution monitors from 18 inches away. Customers view those same designs on commercial displays from 10-15 feet away.
What looks elegant on a 27" iMac becomes illegible on a 55" commercial screen at queue distance.
Common Typographic Failures
Low-contrast fonts: Light gray on white, or colored text on busy food photography
Decorative typefaces: Script fonts, thin weights, and "unique" brand fonts that prioritize style over clarity
Dense layouts: Too many items crammed into too little space
Undersized text: Font sizes appropriate for print menus, not digital displays
These aren't design crimes—they're misunderstandings of the viewing context.
---
The Viewing Distance Formula
The most important variable in digital menu typography is viewing distance. Everything else derives from this.
Standard Viewing Distances in QSR
| Zone | Typical Distance | Purpose | |------|-----------------|---------| | Counter/Order Point | 5-8 feet | Final order confirmation | | Queue Area | 8-15 feet | Primary decision-making | | Entry/Welcome | 15-25 feet | Category awareness |
Design priority: Queue area (8-15 feet). This is where customers make purchasing decisions.
The 1-Inch Rule
A widely-used industry guideline: 1 inch of letter height per 10 feet of viewing distance.
| Distance | Minimum Cap Height | |----------|-------------------| | 5 feet | 0.5 inches | | 10 feet | 1 inch | | 15 feet | 1.5 inches | | 20 feet | 2 inches |
For a queue distance of 12 feet, critical text (prices, item names) should have a cap height of at least 1.2 inches on the display.
Converting to Pixels
The conversion depends on your screen's pixel density:
- 1080p on 55" screen: ~1 inch = 35 pixels
- 4K on 55" screen: ~1 inch = 70 pixels
For a 55" 1080p display viewed at 12 feet:
- Minimum item name size: 40-50px
- Minimum price size: 45-55px
- Category headers: 60-80px
---
Font Selection Guidelines
Not all fonts are created equal for digital signage. What works in print or on websites often fails on menu boards.
Recommended Font Families
High-Readability Sans-Serif Fonts:
- Roboto — Google's workhorse, excellent at all sizes
- Open Sans — Wide letterforms, clear at distance
- Lato — Good balance of personality and clarity
- Source Sans Pro — Adobe's designed-for-screens option
- Nunito — Soft, friendly, highly readable
Fonts to Avoid:
- Script/cursive fonts (illegible at distance)
- Ultra-thin weights (disappear on screens)
- Decorative/display fonts (too complex)
- Condensed fonts (reduced legibility)
The Brand Font Dilemma
Many brands have proprietary fonts that look great on packaging but fail on digital signage.
Compromise approach:
- Use brand fonts for headers/logos (where they're large enough)
- Use high-readability fonts for menu items and prices
- Ensure brand guidelines allow for "extended brand fonts" in specific contexts
Better than illegibility: A readable menu that's 80% on-brand beats a perfectly on-brand menu that customers can't read.
Font Weight Recommendations
| Element | Recommended Weight | |---------|-------------------| | Category headers | Bold (700) | | Item names | Medium or SemiBold (500-600) | | Prices | Bold (700) | | Descriptions | Regular (400) | | Fine print/calories | Regular (400), larger size |
Avoid: Light (300) and Thin (100-200) weights. They lose definition on LED screens and disappear in bright environments.
---
Contrast Ratio Requirements
Contrast is the difference in luminance between text and background. Insufficient contrast makes text hard to read, especially for older customers or those with visual impairments.
WCAG Standards
The Web Content Accessibility Guidelines provide specific contrast ratios:
| Level | Ratio | When to Use | |-------|-------|-------------| | WCAG AA (minimum) | 4.5:1 | Normal text | | WCAG AA Large | 3:1 | Text 24px+ or 18px+ bold | | WCAG AAA (preferred) | 7:1 | Maximum accessibility |
For digital menu boards, target WCAG AA minimum (4.5:1) and aim for AAA (7:1) where possible.
Common Contrast Failures
Problem 1: Text on Food Photography White text over a photo of a burger looks great—until the burger has a light bun or mayo drip right behind the text.
Solution: Use semi-transparent dark overlays behind text, or dedicate text zones separate from imagery.
Problem 2: Subtle Brand Colors Brand guidelines specify "light gray secondary text" that works in print. On screens in bright environments, it becomes invisible.
Solution: Adjust brand colors for screen applications. Darken grays, strengthen accent colors.
Problem 3: Colored Backgrounds Orange text on red background. Blue text on purple background. These combinations fail contrast requirements.
Solution: Test every color combination with a contrast checker before deployment.
Free Contrast Checking Tools
- WebAIM Contrast Checker: webaim.org/resources/contrastchecker
- Colour Contrast Analyzer: developer.paciellogroup.com/resources/contrastanalyser
- Stark Figma Plugin: For designers working in Figma
---
Layout Density Guidelines
Even with perfect font choices and contrast, cramming too much content into too little space destroys readability.
Maximum Items Per Visible Section
| Screen Size | Max Items Visible | |-------------|------------------| | 32" | 6-8 items | | 43" | 8-12 items | | 55" | 12-16 items | | 65" | 14-18 items |
These assume standard QSR viewing distances (8-15 feet) and include item name + price + brief modifier.
The Power of Whitespace
Whitespace isn't wasted space—it's breathing room that allows each item to be processed individually.
Minimum spacing recommendations:
- Between items: 1.5x line height
- Between categories: 2.5x line height
- Margins: 5% of screen width minimum
The Squint Test
A simple validation: step back 15 feet from your screen and squint. If you can't immediately distinguish individual items, your layout is too dense.
If items blur together, your customers experience that confusion clearly—along with the frustration.
Column vs. Grid Layouts
Columns work well for:
- Long category lists
- Price-focused displays
- Simple item + price formats
Grids work well for:
- Visual menus with photos
- Combo or bundle displays
- Limited item counts
Avoid: Mixing too many layout patterns on one screen. Consistency aids scanning.
---
Real-World Testing Methods
Design specifications are starting points. Real-world testing validates (or corrects) your choices.
The 15-Foot Stand-Back Test
Stand 15 feet from your screen in the actual installation environment: 1. Can you read item names without effort? 2. Can you identify prices immediately? 3. Can you distinguish categories? 4. Does any text require squinting?
If any answer is "no," revise before deployment.
Sunlight and Glare Simulation
Test in the worst lighting conditions your screens will face:
- Direct morning or afternoon sun
- Reflections from windows or glass
- Wash-out from overhead lighting
If text disappears in harsh light, increase contrast or reposition screens.
Testing with Diverse Users
Your design team likely has good vision. Test with:
- Users over 50 (presbyopia is common)
- Users with glasses or contacts
- Users unfamiliar with your menu
- Users in a hurry
Real feedback from diverse users reveals problems designers miss.
---
Accessibility and Compliance
Beyond good practice, accessibility has legal dimensions.
ADA Considerations
The Americans with Disabilities Act doesn't specify exact requirements for digital menu boards, but general accessibility principles apply:
- Readable from wheelchair height (screens should be visible to seated users)
- No reliance on color alone (don't indicate "unavailable" with only red text)
- High contrast as default (not hidden behind a settings menu)
Connection to Kiosk Accessibility
If your menu boards connect to self-order kiosks, accessibility standards become more explicit. Ensure consistency between boards and kiosks.
---
Quick Reference: Typography Specifications
| Element | Size (55" 1080p) | Weight | Notes | |---------|-----------------|--------|-------| | Category Header | 60-80px | Bold | All caps acceptable | | Item Name | 40-55px | SemiBold | Mixed case preferred | | Price | 45-60px | Bold | Consistent placement | | Description | 30-40px | Regular | Optional, brief | | Calories/Info | 24-32px | Regular | Meets regulatory requirements |
Contrast Requirements Summary
- Minimum: 4.5:1 for all text
- Target: 7:1 for prices and key information
- Avoid: Text directly on photography without overlay
---
How SeenLabs Helps
Typography and layout standards are built into the SeenLabs platform:
Pre-Tested Template Library Every template is validated for viewing distance readability, WCAG compliance, and layout clarity—no guesswork required.
Design Guidelines Built-In Recommended font sizes, weights, and spacing are embedded in the content editor, guiding operators toward readable designs.
Multi-Zone Layouts Purpose-built templates that separate text-heavy menu zones from promotional zones, ensuring legibility where it matters most.
Content Best Practices Documentation and support resources specifically for QSR menu design, not generic signage.
---
Conclusion: Legibility Is Non-Negotiable
Beautiful design that customers can't read is failed design. Every typography choice, contrast decision, and layout adjustment should serve one master: can the customer find what they need to order?
Key Takeaways
1. Calculate for viewing distance — The 1-inch-per-10-feet rule is your starting point 2. Choose readable fonts — Sans-serif, medium+ weight, tested at distance 3. Verify contrast ratios — 4.5:1 minimum, 7:1 preferred 4. Reduce density — Whitespace aids processing, clutter destroys it 5. Test in real conditions — 15-foot stand-back, diverse users, harsh lighting
The menu board that looks stunning AND converts is possible. It just requires putting readability on equal footing with aesthetics.
---
Ready to Improve Your Menu Readability?
---
About SeenLabs
SeenLabs builds digital signage solutions with legibility engineered in from the start. Our templates and design tools help operators create menus that are both beautiful and readable.