Skip to main content

​
Overview

Magic Patterns supports custom fonts through the Typography section of your Design System. You can upload your own font files, choose a popular Google Font, or paste a web-hosted font URL. Every design created with that Design System will automatically use your specified fonts. You can also reference any font by name directly in your prompts:
Prompt
Use Merriweather font from Google Fonts.

​
Managing Fonts in Your Design System

The Typography section lives inside your Design System and lets you create font groups for different use cases like headings, or body text
Typography in Design Systems
To set up fonts in your Design System:
  1. Open your Design System
  2. Go to the Typography section
  3. Click Add Font Group to create a new group
  4. Choose your font source:
    • Upload your own custom font file
    • Pick a Google Font from fonts.google.com
    • Paste a link to any web-hosted font
  5. Save your changes
Now every design you create with that Design System will automatically use your specified fonts.

​
Finding Google Fonts

To explore available fonts:
  1. Visit Google Fonts to browse thousands of free fonts
  2. Preview different fonts and styles
  3. Note the font name (e.g., “Roboto”, “Playfair Display”)
  4. Use that exact name when adding a Google Font group, or reference it directly in your prompt