Lazy Google Fonts – Examples

This page provides a set of interactive examples demonstrating how Lazy Google Fonts can be used in different scenarios. Each example focuses on a specific loading strategy or configuration.

Auto Detect

Detects existing Google Fonts already present in the page and leaves them untouched for optimal performance.

View Demo →

Manual Mode

Loads Google Fonts using manually provided URLs, giving developers full control.

View Demo →

Builder Mode

Generates Google Fonts URLs from structured configuration (family, weights, display).

View Demo →

Hybrid Mode

Combines existing critical fonts with lazy-loaded non-critical fonts for balanced performance.

View Demo →

Advanced Configuration

Demonstrates viewport-based loading, caching, and debug logging for performance testing.

View Demo →