Custom Fonts

Who can do this: Owners, Admins, and Editors can add and manage custom fonts. See Roles and Permissions for details.

Typography shapes how your content feels. Use pre-installed fonts for quick setup, or upload your own for perfect brand alignment.

Uploading Custom Fonts

Bring your own typography by attaching font files in chat.

How to upload:

1. Click the attachment icon in the chat input
2. Select your font file
3. Tell Sticklight how to use it

Example prompts:

“Use this font for all headings” + [font file]

“Add this as my body font” + [font file]

“Use this font for the logo and navigation” + [font file]

Supported formats:

• WOFF2 (.woff2) – Best for web; smallest file size, wide browser support
• WOFF (.woff) – Good fallback; slightly larger than WOFF2
• TTF (.ttf) – TrueType; works everywhere but larger file size
• OTF (.otf) – OpenType; similar to TTF with advanced features

For best performance, use WOFF2 when available. If you only have TTF or OTF files, those work fine too.

When to Upload vs. Use Pre-Installed

Upload custom fonts when:

• Your brand has specific typography requirements
• You’ve licensed fonts for your project
• You need exact font matching with other brand materials

Use pre-installed fonts when:

• You’re exploring or prototyping quickly
• You don’t have specific brand fonts
• You want reliable, web-optimized typography

Pre-Installed Fonts

Sticklight includes a curated selection of professional web fonts:

Sans-serif:

• Inter – Clean, modern, highly readable
• Roboto – Friendly, versatile Google font
• Open Sans – Humanist, approachable
• Lato – Warm, stable, professional
• Albert Sans – Geometric, contemporary
• Arial – Universal, reliable fallback

Serif:

• Georgia – Classic, readable, elegant
• Times New Roman – Traditional, formal

Display:

• System fonts optimized for headings

Setting Fonts

Via chat:

“Use Inter for headings and Open Sans for body text”

Via brand kit panel:
Select fonts from the typography dropdown in the design panel.

Typography Hierarchy

Effective typography creates clear hierarchy:

Headings (H1-H6):

• Often bolder weight (600-700)
• Larger sizes with tighter tracking
• May use a different font than body

Body text:

• Regular weight (400)
• Comfortable reading size (16-18px)
• Adequate line height (1.5-1.7)

Accents:

• All-caps for labels
• Italic for emphasis
• Bold for key terms

Font Pairing Principles

Contrast works:

• Sans-serif headings + serif body
• Bold display font + light body font
• Geometric headings + humanist body

Consistency matters:

• Limit to 2 fonts maximum for cohesion
• Same font family, different weights also works well

Adjusting Typography

Beyond font choice, refine with visual editing:

• Font size – Scale up or down
• Font weight – Light to bold
• Line height – Tighter for headings, looser for body
• Letter spacing – Tighter for large text, normal for body
• Text alignment – Left, center, right, justify

Typography via Chat

Request specific adjustments:

“Make all headings bold and slightly larger” “Increase the body text line height for better readability” “Use all-caps for section labels” “Add more letter spacing to the hero headline”