# FiveM Image Sizes & Assets: The Definitive Guide

> Every image a FiveM server needs, with the exact size, format and where it goes: server icon (96×96 PNG), server list banners, loading screen backgrounds, video, inventory icons, Discord art and in-game textures.

Source: https://fam-tools.com/guides/fivem-image-sizes-assets-guide · FAM Tools · published 2026-09-11 · updated 2026-09-11 · about 16 min

**Short answer.** The only hard requirement FiveM itself enforces is the server icon: a 96×96 PNG loaded with load_server_icon. Everything else is a convention. Design loading screens for 1920×1080 (16:9) and let them scale, use WebM for video and MP3 for music, make inventory icons 100×100 transparent PNGs named after the item, keep streamed textures power-of-two and well under 16 MiB, and host every web image on a stable HTTPS link — never a Discord attachment link, which expires.

## Key points

- Server icon: exactly **96×96 PNG**, loaded with `load_server_icon myLogo.png` in server.cfg.
- Server list banners (`banner_detail`, `banner_connecting`) have no official size — use a wide strip such as 1865×108 or 1920×200 and keep text in the centre.
- Loading screen: design at **1920×1080**, test at 1280×720 and 3440×1440, and keep the whole page light.
- Video: **WebM (VP9 or VP8)** is the format that always plays; music: **MP3 at 128–192 kbps**.
- Inventory icons: **100×100 transparent PNG**, file name identical to the item name.
- Streamed textures: power-of-two sizes; FiveM warns at 16 MiB per asset and calls anything over 48 MiB a streaming risk.

A FiveM server shows its face in more places than most owners realise: the server list, the connecting screen, the loading screen, the in-game HUD and inventory, Discord, and every video and social post. Each surface has its own size, format and rules, and a few of them are strict — get the server icon wrong and it simply does not appear. This guide lists every one of them in one place, separates the official requirements from the community conventions, and explains the reasons behind each number so you can make the right call when your situation is different.

## The cheat sheet: every FiveM image size in one table

Bookmark this table. The **Source** column matters: “Cfx docs” means FiveM enforces or documents it, “Discord” means Discord publishes it, and “convention” means it is what works in practice across thousands of servers but nothing will reject a different size.

*Sizes are width × height in pixels.*

| Asset | Size | Format | Where it goes | Source |
| --- | --- | --- | --- | --- |
| Server icon | 96×96 | PNG | `load_server_icon` in server.cfg | Cfx docs (required) |
| Server detail banner | Wide strip, e.g. 1865×108 | PNG / JPG | `sets banner_detail "https://…"` | Convention |
| Connecting banner | Wide strip, e.g. 1865×108 | PNG / JPG | `sets banner_connecting "https://…"` | Convention |
| Loading screen background | 1920×1080 (up to 2560×1440) | WebP / JPG | Your loadscreen HTML | Convention |
| Loading screen logo | 512–1024 px wide | PNG / WebP / SVG | Your loadscreen HTML | Convention |
| Loading screen video | 1920×1080, 24–30 fps | WebM (VP9/VP8) | Your loadscreen HTML | Convention |
| Loading screen music | — | MP3 128–192 kbps | Your loadscreen HTML | Convention |
| Inventory item icon | 100×100 | PNG (WebP works) | `ox_inventory/web/images/<item>.png` | Convention |
| Discord server icon | 512×512 or larger | PNG / JPG / GIF | Server settings | Discord |
| Discord server banner | 960×540 (16:9) | PNG / JPG / GIF | Server settings (boost level 2) | Discord |
| Discord invite background | 1920×1080 | PNG / JPG | Server settings (boost level 1) | Discord |
| Discord Rich Presence art | 1024×1024 | PNG / JPG | Discord developer portal | Discord |
| Link preview (Open Graph) | 1200×630 | PNG / JPG | Your website | Convention |
| YouTube thumbnail | 1280×720 | JPG / PNG | YouTube Studio | YouTube |
| TikTok / Shorts video | 1080×1920 (9:16) | MP4 | TikTok / YouTube | Convention |

> **Why “convention” is not a weaker word here** — Where there is no official number, a size becomes standard because it survives every client: every screen resolution, every aspect ratio, every Discord theme. Sticking to the convention is how you avoid the one player whose ultrawide monitor crops your logo in half.

## Server icon: 96×96 PNG, and nothing else

The server icon is the small square next to your server name in the FiveM server browser and on your cfx.re page. It is the only image FiveM is strict about. The Cfx documentation for `load_server_icon` states that the file must be a **96×96 PNG** — a JPG, a 128×128 PNG or a renamed WebP will not show.

*server.cfg*

```cfg
# The file sits next to server.cfg (the server's working directory)
load_server_icon myLogo.png
```

- Export at exactly 96×96. Resizing a large logo down to 96 in a browser tool usually blurs it — export from the design file at that size, or downscale with a sharp filter and check it at 100% zoom.
- Transparency works, but the list background differs between light and dark themes. A logo on a solid rounded square reads everywhere.
- Keep detail minimal. At 96 pixels a wordmark is unreadable; use the symbol from your logo, not the full lockup.
- The path is relative to where the server runs. If the icon does not appear, the server console prints an error when it cannot open the file.

We cover the icon on its own — including how to make one that stays readable at that size — in [the FiveM server icon guide](https://fam-tools.com/guides/fivem-server-icon).

## Server list banners: banner_detail and banner_connecting

FiveM supports two optional banners set as server variables. `banner_detail` is shown on your server’s detail page in the server browser; `banner_connecting` is shown while a player is connecting. Both are URLs, so the image lives on a web host, not on the game server.

*server.cfg*

```cfg
sets banner_detail "https://cdn.example.com/banner-detail.png"
sets banner_connecting "https://cdn.example.com/banner-connecting.png"
```

Cfx has never published an official banner size, and you will find wildly different “official” numbers online. The honest answer: the banner is drawn as a wide strip and scaled to the space available, so what matters is the **shape**. The long-standing community template on the Cfx forum uses **1865×108**; many servers use **1920×200**. Either works if you design for a wide, short strip and keep every important element in the middle third.

> **Do not host banners on Discord** — Since late 2023 Discord attachment links carry a signed expiry. A banner pasted as a Discord CDN link works for a while and then silently disappears. Use your own website, a proper image host or an object store with a permanent public URL.

The full walkthrough, including safe areas and animated banners, is in [the banner guide](https://fam-tools.com/guides/fivem-server-banner-detail-connecting).

## Loading screen images, video and audio

A loading screen is an HTML page rendered by FiveM’s built-in Chromium, so it follows web rules rather than game rules. There is no required resolution: the page fills the player’s window at whatever resolution they run. That is why the right approach is to **design for 1920×1080 and build responsively**, rather than exporting one giant image and hoping it fits.

| Element | Recommended | Why |
| --- | --- | --- |
| Background image | 1920×1080 WebP or JPG, 300 KB – 1.5 MB | 1080p is the most common player resolution; 2560×1440 if your art has fine detail. |
| Background fit | `object-fit: cover` on a full-viewport element | Crops the edges on ultrawide instead of stretching the image. |
| Logo | Transparent PNG/WebP or SVG, 512–1024 px wide | Sharp on 4K without being heavy; SVG scales perfectly. |
| Video | WebM VP9 (or VP8), 1080p, 24–30 fps, 10–30 MB | WebM is the format FiveM’s Chromium plays in every build. |
| Music | MP3, 128–192 kbps, stereo | Reliable in CEF and small enough to start instantly. |
| Fonts | WOFF2, self-hosted, 1–3 families | Loads with the page; no flash of fallback fonts. |

Keep the text-safe area in the centre 1280×720 of your 1920×1080 design. A player on a 21:9 ultrawide sees extra width, a player on a 16:10 laptop loses a sliver of the sides, and a centred safe area survives both. Our guides on [responsive loading screens](https://fam-tools.com/guides/fivem-loading-screen-resolution-responsive), [video backgrounds](https://fam-tools.com/guides/fivem-loading-screen-video-background) and [fonts](https://fam-tools.com/guides/fivem-loading-screen-fonts) go deeper on each element.

> **Why WebM rather than MP4** — Chromium builds without proprietary codecs cannot decode H.264, and support for MP4 inside FiveM has varied between client builds. WebM with VP9 or VP8 is royalty-free and always supported, so it is the safe default. Convert with `ffmpeg -i in.mp4 -c:v libvpx-vp9 -b:v 4M -an out.webm`.

## In-game UI: inventory icons, HUD and NUI images

Everything drawn by a script’s interface — inventory, HUD, phone, menus — is NUI: another HTML page in the same Chromium. Those images follow the same web rules, with one important convention for inventories.

- **ox_inventory** loads item images from `nui://ox_inventory/web/images` by default. The file name must match the item name exactly, in lowercase: an item called `water` needs `water.png`. The folder can be changed with the `inventory:imagepath` convar.
- **The de-facto icon size is 100×100** with a transparent background and the item centred with a small margin. Larger sources (256×256) are fine but are downscaled anyway, so they only cost memory.
- **qb-inventory** and most QBCore inventories read from their own `html/images` folder with the same name-matching rule.
- **HUD icons** are best as inline SVG or an icon font, which stay sharp at every resolution and cost almost nothing.

Weapon icons follow the same rules; the weapon studio covers them in detail in its [weapon inventory image guide](https://fam-tools.com/guides/fivem-weapon-item-images).

## In-game textures: power of two and the 16 MiB warning

Textures that are streamed into the game world — vehicle liveries, clothing, weapon skins, map tiles — are not web images. They live in `.ytd` texture dictionaries, compressed in GPU formats (DXT1, DXT5, BC7) with mipmaps, and the rules are the engine’s.

- Use **power-of-two** dimensions: 512, 1024, 2048, 4096. Non-power-of-two textures break mipmapping and waste memory.
- Pick the smallest size that looks right at the distance players see it. A pistol grip does not need 4096×4096.
- Compress: DXT1 for textures without alpha, DXT5 when you need alpha, BC7 when quality matters more than size.
- Generate mipmaps. Without them distant objects shimmer and the game reads full-resolution data it never needed.

The FiveM server checks every streamed asset when it starts. Any asset using more than **16 MiB** of physical or virtual memory is printed as a warning, the colour gets more alarming at 32 and 64 MiB, and above **48 MiB** the message adds: *“Oversized assets can and WILL lead to streaming issues (such as models not loading/rendering).”* Treat 16 MiB as your ceiling, not 48.

| Asset type | Typical texture size | Notes |
| --- | --- | --- |
| Vehicle livery | 2048×2048 | 4096 only for hero vehicles; every extra livery multiplies memory. |
| Clothing (EUP style) | 512–1024 | Hundreds of drawables add up quickly across a server. |
| Weapon skin | 1024–2048 | Seen up close in first person, so detail matters here. |
| Minimap tiles | Fixed by the game | Replace at the exact size of the original tile. |

Minimap textures are the one case where you have no choice at all: the replacement must match the dimensions and layout of the original tiles. The minimap studio explains the full layout in its [minimap technical specification](https://fam-tools.com/guides/minimap-technical-specification).

## Discord: icon, banner, invite background and Rich Presence

For most FiveM communities Discord is the front door, so its images deserve the same care as the server’s.

| Image | Size | Notes |
| --- | --- | --- |
| Server icon | 512×512 or larger | Shown as a circle or rounded square — keep the mark inside the centre. |
| Server banner | 960×540 (16:9) | Discord’s published recommendation; 1920×1080 also uploads and is resized. Needs boost level 2. |
| Invite background | 1920×1080 | JPG or PNG. Shown behind your invite link. Needs boost level 1. |
| Custom emoji | Up to 128×128 | 256 KB file limit. |
| Rich Presence art | 1024×1024 | Discord “strongly recommends” 1024×1024 for activity art. |

Rich Presence is the “Playing on your server” card players see on each other’s profiles; FiveM can set it with a few natives. The whole setup is in [the Discord Rich Presence guide](https://fam-tools.com/guides/fivem-discord-rich-presence), and the full Discord art set in [Discord branding sizes](https://fam-tools.com/guides/fivem-discord-server-branding-sizes).

## Website and social media

- **Open Graph image: 1200×630.** This is the card shown when your website link is shared on Discord, X and Facebook. Without it your link posts as bare text.
- **YouTube thumbnail: 1280×720** (16:9, minimum 640 wide). A face or a vehicle and three words beat a paragraph.
- **Vertical video: 1080×1920** for TikTok, Reels and Shorts — the channel that brings most new players to roleplay servers today.
- **Favicon:** a 512×512 PNG master, exported down to 32×32 and 180×180 (Apple touch icon).

## Where to host images so they never break

Anything referenced by URL — banners, loading screen assets hosted online, NUI images loaded from the web — is only as reliable as its host. The server icon is the exception, because it is read from disk.

1. Use HTTPS. The loading screen and NUI pages are served securely, and Chromium blocks `http://` media on secure pages.
2. Use a direct file URL. The address must return the image itself — a share page from a cloud drive returns HTML.
3. Use a host that allows cross-origin requests if scripts read the file (for example to draw it on a canvas).
4. Avoid links that expire: Discord attachments and some image hosts sign their URLs.
5. Version your files (`banner-v2.png`) when you change them, so players do not keep a cached old copy.

Files placed inside a resource and declared in the manifest are served by the FiveM server itself and never expire, which is often the simplest option for loading screen assets. See [how NUI asset paths work](https://fam-tools.com/guides/fivem-nui-assets-paths).

## A practical export workflow

Design once, export many times. Keep a single master file per asset and export every size from it, so a colour change updates everything at once.

1. Create a master logo as a vector (SVG or a vector layer) with a symbol-only variant for small sizes.
2. Export the server icon at 96×96 PNG from the symbol variant.
3. Export the Discord icon at 1024×1024 and let Discord downscale it.
4. Build the loading screen background at 1920×1080 and export WebP at quality 80–85.
5. Export banners at 1865×108 or 1920×200 with the text centred.
6. Check every export at 100% zoom, on a dark and a light background.

Consistency across all of these is what makes a server look established. The [server branding kit guide](https://fam-tools.com/guides/fivem-server-branding-kit) turns this list into a reusable set of colours, fonts and templates. Every one of these sizes is cut for you in [a graphics pack](https://fam-tools.com/graphics), so nothing has to be resized by hand.

## Questions

### What size is the FiveM server icon?

Exactly 96×96 pixels, PNG format. It is loaded with `load_server_icon yourfile.png` in server.cfg, and the file sits next to server.cfg. Other sizes and formats are not shown.

### What is the official FiveM banner size?

There is none. `banner_detail` and `banner_connecting` are scaled to fit, so design a wide strip — 1865×108 (the Cfx forum template) or 1920×200 are both common — and keep text in the centre. See [the banner guide](https://fam-tools.com/guides/fivem-server-banner-detail-connecting).

### What resolution should a FiveM loading screen be?

Design at 1920×1080 and build the page responsively so it scales to every resolution. A loading screen is a web page, so it fills whatever window the player has.

### Can I use an MP4 video in my loading screen?

WebM (VP9 or VP8) is the safe choice because it plays in every FiveM client build. H.264 MP4 support has not been reliable, so convert MP4 files to WebM before using them.

### What size should ox_inventory item images be?

The common standard is 100×100 transparent PNG. The file name must match the item name exactly, and the default folder is `ox_inventory/web/images`.

### Why does my server icon not show?

Usually the file is not exactly 96×96, is not a real PNG, or the path in `load_server_icon` does not match the file next to server.cfg. Check the server console on start — it reports when it cannot load the icon.

### How big can a streamed texture be in FiveM?

There is no hard cap, but the server warns about any asset using more than 16 MiB of memory and calls anything above 48 MiB a streaming risk. Aim for 2048×2048 or smaller with compression and mipmaps.

### Can I host my banner on Discord?

No. Discord attachment links now expire, so the banner disappears after a while. Host it on your website or a permanent image host with an HTTPS direct link.

### What size is a Discord server banner?

Discord recommends 960×540 (16:9). A 1920×1080 image also uploads and is resized. The banner requires server boost level 2.

### Do I need a 4K loading screen background?

Rarely. A well-compressed 1920×1080 or 2560×1440 image looks sharp on most screens and loads far faster than a 4K file. Load time matters more than pixels players will not notice.

## Related

- https://fam-tools.com/guides/fivem-server-icon
- https://fam-tools.com/guides/fivem-server-banner-detail-connecting
- https://fam-tools.com/guides/fivem-loading-screen-resolution-responsive
- https://fam-tools.com/guides/fivem-discord-server-branding-sizes
