# How to Add Custom Fonts in Bubble.io

> To add custom fonts in Bubble, navigate to Settings and the File Manager to upload your custom font file. Then, return to the editor via the Styles tab, open the font selector, and apply your newly added custom font to text elements.

Canonical: https://livedemo.ai/tutorials/how-to-add-custom-fonts-in-bubble-io/
Apps: Bubble
Updated: 2026-10-05
Interactive demo: https://story-api.livedemo.ai/workspaces/62255d3d3304f17b8f5e2d03/stories/692a2d3b57f8f6cdddddd4a1/preview?step=1

## Steps

1. Click 'Settings' to access the visual editor to start customizing your application's appearance.
2. Navigate to the 'SEO and Metatags' section.
3. Scroll down to 'Advanced Settings' and find the 'Script/meta tags in header' field.
4. Modify text formatting to enhance visual hierarchy and readability.
5. Open additional design tools to further customize your application by clicking the 'Data' tab.
6. Access the 'File Manager' to upload and manage custom assets.
7. Select the 'Upload' button to add custom fonts to your application.
8. Watch as your custom font file uploads to your application.
9. View your uploaded 'Poppins' font file in the asset library.
10. Return to the editor to apply your newly added custom font by clicking the 'Styles' tab.
11. Select this placeholder text to modify its appearance.
12. Change from the default Gilroy-Regular font to your custom font.
13. Open the font selector to view all available typography options.
14. Navigate through your font library to find your custom fonts and apply the 'Poppins' font to give your design a fresh, modern look.