Font Converter

Font Audit Checklist: Complete Font Usage Review Guide

A systematic checklist for auditing your website's font usage covering inventory, performance, accessibility, licensing, and ongoing governance

TL;DR

In Simple Terms

Start by inventorying every font loaded on your site using DevTools (document.fonts API or Network tab filtered to 'font'). Most sites load 3-8 font files; if you find more than 10, you likely have redundancies or unused fonts.Check performance: total font payload should be under 150KB (ideally under 100KB). All fonts should be WOFF2, served with immutable cache headers, and preloaded for above-the-fold content. Missing font-display causes invisible text (FOIT).Verify every font has a valid license for its usage context (web, desktop, app). Unlicensed web font usage is the #1 compliance risk found in font audits. Use our Font License Checker tool to verify permissions.

Share this page to:

LinkedInReddit
Convert Font InstantlyExplore Font ConvertersUnderstand Font FormatsFont FAQsTypography Glossary

Why a Font Audit Matters

Fonts are often the most overlooked performance and compliance liability on a website. Industry data shows 70% of sites lack a font-display property, 55-60% fail font contrast ratio checks, and 40% have CLS issues caused by font loading. A font audit identifies unused fonts, licensing violations, performance bottlenecks, and accessibility gaps. Regular audits (quarterly or before major releases) prevent these issues from accumulating.

Audit AreaRisk if SkippedTypical Finding
InventoryUnused fonts wasting bandwidth30% of loaded fonts are unused on the page
PerformanceSlow LCP, layout shifts from fontsFonts add 300-800ms to page load
AccessibilityWCAG failures, poor readabilityBody text below 16px or low contrast ratios
LicensingLegal liability, $20K-$150K settlementsDesktop font used on web without web license

Step 1: Font Inventory

Start by identifying every font your site loads. Open Chrome DevTools and use these methods:

// Method 1: List all loaded fonts via document.fonts API
const loadedFonts = [];
document.fonts.forEach(font => {
  loadedFonts.push({
    family: font.family,
    weight: font.weight,
    style: font.style,
    status: font.status  // 'loaded', 'loading', 'error', 'unloaded'
  });
});
console.table(loadedFonts);

// Method 2: Check which fonts are actually used on the page
const usedFonts = new Set();
document.querySelectorAll('*').forEach(el => {
  const computed = getComputedStyle(el);
  usedFonts.add(computed.fontFamily.split(',')[0].trim().replace(/['"]/g, ''));
});
console.log('Fonts used on page:', [...usedFonts]);

// Method 3: Network tab - filter by "font" resource type
// DevTools > Network > filter: "font" to see all font requests

Inventory Checklist

List every font file loaded (name, format, weight, style, file size)
Identify which fonts are used vs. loaded but unused
Check if any fonts are loaded from third-party CDNs (Google Fonts, Adobe Fonts)
Note font file formats: are all WOFF2, or are there legacy TTF/WOFF files?
Count total font requests and combined font payload size
Check for duplicate font loads (same font loaded from different paths)
Verify font families match CSS declarations (no mismatched names)

Step 2: Performance Audit

Total font payload is under 150KB (target: under 100KB for fast sites)
All font files use WOFF2 format (Brotli compression)
font-display is set on every @font-face rule (swap, optional, or fallback)
Critical fonts (above-the-fold headings) are preloaded with <link rel='preload'>
Font files are served with long cache headers (Cache-Control: max-age=31536000, immutable)
No more than 2-4 font weights/styles are loaded per page
Fonts are self-hosted (no third-party CDN latency or privacy concerns)
Fonts are subsetted to remove unused Unicode ranges
No render-blocking font requests in the critical path
CLS (Cumulative Layout Shift) from font swaps is below 0.1

Pro Tip

Run a Lighthouse audit and look for the "Ensure text remains visible during webfont load" warning. This indicates missing font-display declarations. Also check "Reduce unused CSS" which often includes @font-face rules for unneeded weights.

Ideal @font-face Configuration

@font-face {
  font-family: 'BrandFont';
  src: url('/fonts/brand-regular-latin.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC,
                 U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074,
                 U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215,
                 U+FEFF, U+FFFD;
}

/* Preload in HTML <head> */
/* <link rel="preload" href="/fonts/brand-regular-latin.woff2"
        as="font" type="font/woff2" crossorigin> */

Step 3: Accessibility & Compliance

Body text is at least 16px (1rem) -- the browser default and minimum for comfortable reading
Line height is 1.5x or greater for body text (WCAG 1.4.12 Text Spacing)
Contrast ratio meets WCAG AA: 4.5:1 for normal text, 3:1 for large text (18px+ bold or 24px+)
Text can be resized to 200% without loss of content or functionality (WCAG 1.4.4)
Letter spacing, word spacing, line height, and paragraph spacing can be overridden by users (WCAG 1.4.12)
Fallback fonts are specified for all custom font stacks (never just the custom font name alone)
Font weight is sufficient: body text should use weight 400+, never 300 (Light) for body copy
Decorative/display fonts are limited to headings and short text, not used for body copy
WCAG CriterionRequirementHow to Test
1.4.3 Contrast4.5:1 (normal), 3:1 (large)Chrome DevTools color picker, axe-core
1.4.4 Resize Text200% zoom without lossBrowser zoom to 200%, check overflow
1.4.12 Text SpacingOverride line-height, spacing without breakingWCAG text spacing bookmarklet

Step 4: License Compliance

Every font on the site has a documented license (file or subscription receipt)
Web embedding is explicitly permitted by each font's license
Page view limits (if any) are not exceeded for metered web font licenses
Self-hosted fonts were obtained from a legitimate source (not pirated downloads)
Google Fonts are verified as OFL-licensed (free for any use)
Adobe Fonts are covered by an active Creative Cloud subscription
Commercial fonts have licenses matching actual usage (web + desktop if both are used)
No fonts are loaded from unauthorized CDN sources or hotlinked from other sites

Warning

Font foundries actively monitor the web for unlicensed usage. Monotype's Font Radar platform monitors over 98,000 fonts from 650+ foundries, and industry data shows 30-40% of websites have unlicensed fonts. Violation settlements range from $20,000 to $3.5M (NBC Universal paid $2M, $1.5M, and $3.5M in separate cases). Review your font licensing obligations carefully.

Audit Tools & Automation

Font Analysis

  • Our Font Analyzer (browser-based)
  • Wakamai Fondue (wakamaifondue.com)
  • FontDrop! (fontdrop.info)
  • FontTools (Python, command-line)

Performance Testing

  • Lighthouse (built into Chrome DevTools)
  • WebPageTest (webpagetest.org)
  • Chrome UX Report (CrUX) for field data
  • SpeedCurve for continuous monitoring

Accessibility

  • axe DevTools (browser extension)
  • WAVE Web Accessibility Evaluator
  • Chrome DevTools Contrast Checker
  • Pa11y (automated CI testing)

License Verification

  • Our Font License Checker
  • Font file metadata inspection (nameID 0, 7, 13)
  • Foundry-provided license verification portals
  • Internal license registry/spreadsheet

Fixing Common Issues

Issue: Fonts are TTF/WOFF instead of WOFF2

Convert all web fonts to WOFF2 using our converter tool or FontTools. WOFF2 saves 30-50% file size over TTF and 20-30% over WOFF.

Issue: Too many font weights loaded

Audit CSS to identify which weights are actually used. Most sites only need Regular (400) and Bold (700). Remove unused weights from @font-face declarations and delete the files.

Issue: Missing font-display

Add font-display: swap to every @font-face rule. This prevents FOIT (invisible text) and improves perceived load time. See our Font Loading Strategies guide for advanced options.

Issue: Fonts not subsetted

If your site only uses Latin characters, subset fonts to remove unused glyphs. This can reduce file size by 70-90%. Follow our Font Subsetting guide.

Ongoing Font Governance

A one-time audit is helpful, but sustainable font management requires ongoing governance integrated into your development workflow.

# Add to your CI pipeline: font performance budget check
# .github/workflows/font-audit.yml
name: Font Audit
on: [pull_request]

jobs:
  font-check:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v4

      - name: Check font formats
        run: |
          # Fail if any non-WOFF2 web fonts exist
          if find public/fonts -name "*.ttf" -o -name "*.woff" | grep -q .; then
            echo "ERROR: Non-WOFF2 font files found in public/fonts/"
            find public/fonts -name "*.ttf" -o -name "*.woff"
            exit 1
          fi

      - name: Check total font size budget (150KB)
        run: |
          TOTAL=$(find public/fonts -name "*.woff2" -exec stat -c%s {} + | awk '{s+=$1} END {print s}')
          if [ "$TOTAL" -gt 153600 ]; then
            echo "FAIL: Total font size is $(($TOTAL/1024))KB (budget: 150KB)"
            exit 1
          fi
          echo "PASS: Total font size is $(($TOTAL/1024))KB"

Next Steps

For organizations managing fonts across multiple properties, see our Enterprise Font Management guide. For a deep dive on performance, check the Font Optimization Checklist.

Sarah Mitchell

Written & Verified by

Sarah Mitchell

Product Designer, Font Specialist

Font Audit FAQs

Common questions about auditing font usage

Related Resources

Font Performance Guide
Font Licensing Guide
Enterprise Font Management
Font Optimization Checklist