Staff and team sections on a FiveM loading screen
Show a small grid of staff cards — avatar, display name and role — grouped from owners down to support staff, behind a tab if the team is large. Use Discord avatar URLs (cdn.discordapp.com/avatars/<id>/<hash>.png), which do not expire the way attachment links do, or host your own images. Update the list whenever the team changes.
A staff section tells a new player that real people run the server and who to ask for help. Done well it builds trust in seconds; done badly it is a wall of outdated names with broken avatars. The pattern is simple: a few cards, grouped by role, with images that do not break.
Layout
<div class="staff">
<article class="card">
<img src="https://cdn.discordapp.com/avatars/123456789012345678/abcdef1234567890.png?size=128" alt="">
<strong>Mike</strong>
<span class="role owner">Owner</span>
</article>
<!-- … -->
</div>.staff { display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: 12px; }
.card { display: grid; justify-items: center; gap: 6px; padding: 14px; border-radius: 14px; background: rgba(0,0,0,.45); }
.card img { width: 64px; height: 64px; border-radius: 50%; object-fit: cover; }
.role.owner { color: #f5b454; }Images that do not break
Discord user avatars have stable URLs of the form https://cdn.discordapp.com/avatars/<user id>/<avatar hash>.png?size=128. They change only when the person changes their avatar. Attachment links (images uploaded into a channel) are different: since late 2023 they are signed and expire, so they eventually stop loading. For full control, host a small copy of each avatar yourself.
Privacy
Some staff prefer not to be named publicly — moderators on big servers can attract harassment. Ask before listing someone, and consider listing roles (“Support team: 6 members”) instead of every name.
Connecting it to your staff structure
The roles on the loading screen should match your Discord roles and in-game permissions. How to structure a staff team is covered in staff team structure.
Common questions
How do I show Discord avatars on my loading screen?
Use the avatar CDN URL, https://cdn.discordapp.com/avatars/<user id>/<avatar hash>.png?size=128, or host the images yourself.
Why did my staff images stop loading?
They were Discord attachment links, which expire. Use avatar URLs or your own hosting.
Should I list every staff member?
List leadership and main contacts; for large teams, group the rest by role or show a count.
Want a loading screen you never have to debug?
Build it in the browser, export once, and edit it whenever — no HTML, no re-uploads.
Start free