Discord role color preview

See instantly how your role color looks in all four Discord themes – with a contrast score and a suggestion when the name is hard to read.

Runs entirely in your browser
Role style
Hex (#3EE0A8) or decimal (4120744).
Contrast target
Dark#1A1A1E
Alexnow
just got a new role: @Moderator
Alex
5.50:1good
Ash#323339
Alexnow
just got a new role: @Moderator
Alex
3.99:1large only
Onyx#000000
Alexnow
just got a new role: @Moderator
Alex
6.66:1good
Light#FBFBFB
Alexnow
just got a new role: @Moderator
Alex
3.05:1large only

Preview – may differ slightly from Discord. Discord partly adjusts gradients for light and dark themes automatically.

Values

Hex
#3498DB
Decimal (for bots and the API)
3447003
RGB
rgb(52, 152, 219)
API field colors
{"primary_color": 3447003, "secondary_color": null, "tertiary_color": null}

Popular color sets

Rank ladder
Pastel
Neon
Discord defaults
Levels & medals
Earthy
Gradient ideas

How it works

  1. Choose solid, gradient or holographic and set the color – via picker, hex or decimal.
  2. Check the four previews: name, mention and member list.
  3. If a theme is marked red, click “Adjust” – the tool only changes the lightness.
  4. Copy hex or decimal and enter the color in Server Settings → Roles.

The preview backgrounds come from the current Discord client: Dark #1A1A1E, Ash #323339, Onyx #000000 and Light #FBFBFB.

FAQ

How do I get a gradient role color?

Gradients and the holographic style are “Enhanced Role Styles”. The server needs 3 Server Boosts, independent of the boost level. Then pick “Gradient” and two colors under Roles → Role Style on desktop.

Can I change the holographic colors?

No. Holographic uses fixed colors set by Discord. Via the API, any role with a tertiary color is forced to these values.

Why is my role color hard to read?

Dark colors disappear on dark themes, bright ones (yellow, pastels) on Light. A contrast of 4.5:1 counts as easy to read, 3:1 as the minimum. The tool calculates it for every theme.

What is the decimal number?

Bots and the Discord API store colors as integers. #3498DB becomes 3447003. In the Discord app itself you enter the hex color.

Can everyone see my gradient role?

Yes, on mobile too. People on an outdated app only see the first color. If the server drops below 3 available boosts, gradients revert to a solid first color.