Personal typography reference
A copy-ready typography guide for Leo's websites, videos, subtitles, quotes, signatures, and AI design briefs. It uses the same Lotion, Sooty, Salt, and muted accent palette as Leo's visual system.
Recommended stack
Ubuntu is the default main text font. It stays friendly and clear in forms, paragraphs, tools, cards, tables, and ordinary product pages.
POIRET ONE IS FOR SHORT QUOTATION MOMENTS
Leo Wang
Every font has a role. Decorative fonts stay out of body text.
var(--font-body)
Ubuntu is good for every thing. Subtitle is also OK. The main text uses Ubuntu in most cases.
Use: Good for everything. Title is not fancy, but bold Ubuntu is still usable.
Avoid: Do not expect it to create a luxury title mood by itself.
var(--font-title)
Lexend gives titles a clean structure without becoming decorative or fragile.
Use: Good for main text, excellent for structured titles when used in bold.
Avoid: Do not use it when a delicate quote or handwritten signature is needed.
"Leo Advent Pro", sans-serif
GOOD FOR SUBTITLE. OK IN UPPERCASE OR Capitalized. Not very good for main text.
Use: Good for subtitles when it is not bold. OK in uppercase or capitalized style.
Avoid: Not very good for long main text.
var(--font-quote)
GREAT FOR QUOTATION IN UPPERCASE. Capitalized subtitles are OK in a quiet frame.
Use: Great for quotation in uppercase. No bold format, only light.
Avoid: Not good for main text. Do not fake bold weight.
"Leo Julius Sans One", sans-serif
ONLY GOOD FOR SHORT QUOTATION TREATMENT.
Use: Uppercase-only feeling, wider than Advent Pro, useful for quotation moments.
Avoid: Not OK for main text or subtitle use.
var(--font-signature)
This is typically for signature style usage.
Use: Best as a personal signature, note, or tiny human mark.
Avoid: Not for title, subtitle, main text, forms, or dense UI.
Leo's Font System is a copy-ready typography reference for Leo's web pages, video visuals, subtitles, quotes, and design handoffs. It records which fonts are safe for body text, which fonts should be used only for subtitles or quotation moments, and which fonts are decorative accents rather than interface fonts. The page is designed to work alongside Leo's Visual Palette, so the typography is shown on the same warm Lotion canvas, with Sooty text, Salt controls, and muted accent colors.
The system separates fonts by role instead of treating every favorite font as interchangeable. Body text must stay readable and calm, so Ubuntu is the default and Trebuchet MS, Tahoma, and Lexend remain acceptable fallbacks. Subtitle text can be more expressive but still has to stay legible, which is why Advent Pro is preferred in regular weight and capitalized or uppercase settings. Quotation text can carry more personality, so Poiret One and Julius Sans One are reserved for short, deliberate moments. Signature text is a separate category: Shadows Into Light gives a human mark, but it should never become the main visual voice of a page.
Most font-pairing tools answer a broad question: which two fonts look good together? Leo's Font System answers a narrower and more useful question: which font should Leo use for each role? It preserves a specific design decision, renders every chosen font live, explains the boundaries, and gives a one-click brief that can be pasted into any design conversation. Typography should feel calm, readable, slightly distinctive, and easy to hand off.
Use the COPY ME button for the complete typography brief, then inspect each live font sample to understand where the font should and should not be used.
Use Ubuntu as the default body font. Lexend, Trebuchet MS, and Tahoma are also good body choices, but decorative fonts such as Poiret One, Julius Sans One, and Shadows Into Light should not be used for main text.
Advent Pro is the preferred subtitle font when it is not bold. Poiret One can work for capitalized subtitles. Julius Sans One is not recommended for subtitles because it is uppercase-only and too wide.
Poiret One is great for uppercase quotation lines, Julius Sans One can work for bold uppercase quotation treatment, and Shadows Into Light is reserved for signature-style accents.
Yes. The page exposes the font rules in visible text, schema.org metadata, CSS variables, and a copy-ready typography brief for AI-assisted web or video design.
