Skip to main content
Custom Theme Color & Fonts

How to customize the color scheme and fonts of your app

Luke Melia avatar
Written by Luke Melia
Updated over a week ago

You can use our Theme Chooser feature to customize the color of your app to match your branding, and customize the fonts used.

Where to find the Theme Chooser

In the editor, you'll see the button to show the Theme Choose at the bottom left, just above the Publish or Preview button. Go ahead and click it:
โ€‹

Customizing the color scheme of your app

Click any color swatch to set the theme color, or click the color wheel to bring up a color selection tool where you can either select from a full range of colors, or type in a "hex" code to match an exact color.

You can also flip between the "Light" and "Dark" themes.

The color scheme changes apply to your entire app, except the Cover, which has its own settings.

Note: We suggest you stay away from white/near-white background colors.

Customizing the fonts of your app

Using the menus labeled "Body" and "Headline," you can customize the fonts your app uses. The "headline" font is used for the top title bar or the largest headline at the top of each screen. The "body" font is used for all other text in the app.

The selection of available fonts comes from the collection of open-source licensed fonts at Google Fonts. We chose fonts that work well for Yapp, but if there is a Google Font that you would like to see added to Yapp that we don't currently offer, let us know.

Note: our standard cover layout UI also allows you to customize the font for your app's cover. It will use your app-wide Headline font choice by default.

Did this answer your question?