---
title: theme_color vs background_color (Manifest)
description: A manifest has two colours that do different jobs: theme_color tints the OS UI around your app, background_color paints the splash screen. Plus the meta theme-color.
canonical: https://favicontools.com/glossary/theme-color-vs-background-color
---

# theme_color vs background_color (Manifest)

In a web app manifest, theme_color tints the operating-system UI around your installed app (the status bar and title area) while background_color paints the splash screen shown while the app loads, before your CSS applies. They're separate fields for separate moments. The <meta name="theme-color"> tag does the theme_color job for a normal browser tab.

## Two colours, two moments

theme_color is shown while your app is running: the OS uses it to tint the chrome around the window, like the status bar and the title area. background_color is shown earlier. It's the flat colour of the splash screen the OS draws while the app is still loading, before any of your CSS has applied.

Setting background_color to roughly your page's background makes the launch feel seamless; leaving it default gives you a white flash before your app paints.

## Which is which

| Field | When it shows | What it colours |
| --- | --- | --- |
| theme_color | App running | OS UI, status bar |
| background_color | During launch | The splash screen |

> **The meta tag is the browser-tab version:** The <meta name="theme-color"> tag colours the browser UI on a normal tab; the manifest's theme_color is its installed-app equivalent. Set both, to the same colour, so the tab and the installed app match.

## Manifest colours FAQ

### What's the difference between theme_color and background_color?

theme_color tints the OS UI around a running installed app; background_color is the splash-screen colour shown while the app is still launching. Different surfaces, different moments.

### Why is my PWA splash screen the wrong colour?

That colour comes from background_color in the manifest. Set it to match your app's background so there's no jarring flash before your CSS loads.

### Do I still need the meta theme-color tag?

Yes, for normal browser tabs. The manifest's theme_color only applies to the installed app. Keep the meta tag and the manifest value in sync.