Skip to main content

Adding a background

To put an image behind Discord’s interface, add an optional background object to your theme definition. Set the image url, then adjust how it looks behind the UI with blur and opacity.

Fields

string
required
The image to display behind the interface.
number
How much to blur the image. Higher values soften it so foreground text stays readable.
number
How visible the image is behind the UI, from 0 (hidden) to 1 (fully opaque).
A background can make text harder to read. Choose semantic colors that stay readable over the image, and use blur and a lower opacity to keep the interface legible.
To let the image show through, make the surfaces above it semi-transparent in your semantic colors. A fully opaque BACKGROUND_PRIMARY hides it entirely.