> Source: https://fivemad.com/docs/tools/inventory-icons > Section: Tools > Tags: inventory icons, ox_inventory, qb-inventory, items.lua, item images > Tool: https://fivemad.com/tools/inventory-icons > Last updated: 2026-09-22 > Site map for assistants: https://fivemad.com/llms.txt # Inventory Icons Make trimmed, transparent inventory icons from game prop pictures or your own images and export a zip with items.lua for ox_inventory, qb-inventory and more. Inventory Icons turns prop pictures from the game, or your own PNG, JPG and WebP files, into a clean icon pack: background removed, empty edges trimmed, every item padded and sized the same way. You fill in the item data once and download a zip with the icons in the right folder plus the item list for your inventory. ## What it is for Adding items to a server usually means two chores that never match up: finding or cutting a picture for each item, and writing the item entry with the exact same name as the file. This tool does both in one pass. The item name is also the file name, so `water_bottle.png` and `['water_bottle']` can never drift apart. Supported targets: **ox_inventory**, **qb-inventory**, **ps-inventory**, **qs-inventory**, **codem-inventory** and **ESX (items table)**. ## Quick start 1. On **Game props**, search the prop pictures (name, label or tag), narrow them with the category dropdown, and click as many as you want. Then press **Add N props**. 2. Or switch to **Your images** and press **Choose images**, or drop files anywhere on the page. 3. In **Every icon**, pick the **Icon size**, **Format**, **Padding** and the rest. The big preview shows the selected icon. 4. Fix anything odd on a single icon with its own background, tolerance and padding. 5. Fill in the **Items** table: item name, label, weight, stack and so on. Use the bulk bar for many rows at once. 6. Under **Export**, pick your **Inventory**, then **Download zip** or copy the Lua / SQL. ## Adding pictures ### Game props The picker loads about 29,000 prop pictures (160 px transparent WebP, the same ones as in the [Objects List](/docs/tools/objects-list)). Every search word has to match. The grid shows 60 results at a time with **Show more**, and **Select the N shown** picks everything visible. You can pick up to 500 props before you have to add them. Props already in the pack are marked **In pack** and are not added twice. Items made from props get a name from the prop label (for example `Water Bottle` becomes `water_bottle`) and keep the prop model, which qs-inventory uses as `object`. ### Your images Only PNG, JPG and WebP are read; other files in a drop are skipped with a notice. The file name becomes the item name and label: `Water Bottle.png` turns into the name `water_bottle` and the label `Water Bottle`. If you want sharper art than a 160 px prop picture, [Item Icons](https://items.rainmad.com) has 18,000 item images for FiveM inventories. Download the ones you need and drop them here to trim, resize and name them. ## Every icon (pack settings) | Setting | What it does | Default | | --- | --- | --- | | Icon size | Output square: 100, 128, 256 or 512 px | 128 | | Format | PNG or WebP | PNG | | Align | **Center**, or **Bottom** (object sits on the bottom padding line) | Center | | Padding | Empty border on each side, 0-30 % of the icon size | 6 % | | Trim empty edges | Crops transparent space so every item fills the icon the same way | on | | Background removal | Auto, Off, Remove from the edges, Remove one colour everywhere | Auto | | Tolerance | How far a colour may be from the background colour and still be removed, 1-60 | 18 | | Background colour | Colour picker for removal. Empty means it is read from the picture corners; **Use the corners** clears it | empty | | Soft drop shadow | A soft dark shadow under the object | off | | Outline | Outline width 0-8 px with its own colour | 0 px, white | **Reset settings** puts everything back to these defaults. The pack settings and the chosen inventory are remembered in this browser. ### Background removal modes - **Auto (only pictures without transparency)** runs the edge fill only on pictures whose border is solid, like photos and screenshots. Prop pictures and cut out PNGs are left alone. - **Off** keeps the picture as it is. - **Remove from the edges** flood fills from the border using the corner colours (or the colour you picked). White parts inside the object stay, as long as they do not touch the background. - **Remove one colour everywhere** is a chroma key. Good for green screen shots, but it also removes that colour inside the object. > [!TIP] > Raise the tolerance when a halo stays around the object, lower it when parts of the object disappear. Busy or textured backgrounds need a real cut out in an image editor. ## The selected icon Click a tile to open it in the preview. You can switch the preview backdrop between checker, dark and light to see edges on both. The panel shows: - **Object**: the size of the visible object after trimming, in source pixels. - **Scale**: how much it was scaled. Above 1.25x it turns amber and the tile shows a badge like `1.6x`, because upscaled icons look soft. - **Background**: `kept`, or the share of pixels removed. - **File**: the size of the rendered icon. Per icon you can override **Background for this icon**, **Tolerance for this icon** and **Padding for this icon**. **Back to the settings of every icon** drops the overrides. **Icon** downloads just that one file, and the bin removes it from the pack. ## Items table | Column | Meaning | Default | | --- | --- | --- | | Item name | Item key and file name. Lowercase letters, digits and underscores only, max 50 characters, unique | from label or file name | | Label | Display name | from prop label or file name | | Weight (g) | Grams | 100 | | Stack | Stackable | on | | Usable | Shown for qb, ps, qs and codem | on | | Close | Close the inventory on use | on | | Rarity | None, Common, Epic, Legendary. Shown for qs-inventory and ESX | None | | Description | Free text | empty | Names with a problem are marked red with the reason (empty, bad characters, too long, duplicate), and export is blocked until they are fixed. Check rows to use the bulk bar: set **Weight**, **Stacking...**, **On use...** (usable, not usable, close or keep open), **Rarity...**, a description for all checked, **Auto label** (labels back to the prop label or file name), **Name from label**, or **Remove**. The table shows 100 rows and grows with **Show more rows**. ## Export The zip is called `inventory-icons-.zip` and contains the icons in the target folder, the item snippet and a `README.txt` with the steps. | Inventory | Icons folder in the zip | Snippet file | Paste into | | --- | --- | --- | --- | | ox_inventory | `ox_inventory/web/images/` | `items.ox_inventory.lua` | `ox_inventory/data/items.lua` | | qb-inventory | `qb-inventory/html/images/` | `items.qb-core.lua` | `qb-core/shared/items.lua` | | ps-inventory | `ps-inventory/html/images/` | `items.qb-core.lua` | `qb-core/shared/items.lua` | | qs-inventory | `qs-inventory/html/images/` | `items.qs-inventory.lua` | `qs-inventory/shared/items.lua` | | codem-inventory | `codem-inventory/html/itemimages/` | `items.codem-inventory.lua` | `codem-inventory/config/itemlist.lua` | | ESX (items table) | `images/` | `items.esx.sql` | the `items` table in your database | Icons that failed to load or came out empty after background removal are left out, and the status line tells you how many. ### ox_inventory Paste the entries inside the `return { ... }` table. ox_inventory builds the picture path as `web/images/.png` on its own, so for WebP exports every item gets a `client.image` line: ```lua title="ox_inventory/data/items.lua" ['water_bottle'] = { label = 'Water Bottle', weight = 100, stack = true, close = true, client = { image = 'water_bottle.webp', }, }, ``` ### qb-inventory and ps-inventory Both read the qb-core item list. One line per item, pasted inside `QBCore.Shared.Items = { ... }`. Stack maps to `unique = not stack`: ```lua title="qb-core/shared/items.lua" water_bottle = { name = 'water_bottle', label = 'Water Bottle', weight = 100, type = 'item', image = 'water_bottle.png', unique = false, useable = true, shouldClose = true, description = '' }, ``` codem-inventory uses the same fields with a `['name']` key. ### qs-inventory Same fields as qb, plus `rare` when you set a rarity and `object` (the prop model) for items made from props. ### ESX ```sql title="items.esx.sql" INSERT IGNORE INTO `items` (`name`, `label`, `weight`, `rare`, `can_remove`) VALUES ('water_bottle', 'Water Bottle', 1, 0, 1); ``` ESX weights are whole numbers in the unit of `Config.MaxWeight` (kg by default), so grams are rounded to kg with a minimum of 1. `rare` is 1 for Epic and Legendary, 0 for Common or no rarity. ESX core has no icon folder: put the pictures wherever your inventory UI loads item images from. If you run ox_inventory on ESX, pick ox_inventory instead. After pasting, restart the inventory, and for qb-core based inventories restart qb-core too (or the whole server). ## Sizes The stock icons of ox_inventory and qb-inventory are 100x100 PNG, and the inventory scales them to the slot. 128 is a good default and keeps prop pictures sharp. 256 looks crisper on 1440p and 4K screens, but prop pictures are only 160 px, so 256 and 512 upscale them (the settings panel warns you). Keep an eye on the pack size shown next to the icon count: the inventory UI loads every icon, and a few hundred 512 px PNGs add up. ## Limitations - Everything runs in your browser and nothing is uploaded. On some older browsers the page notes that icons render one at a time, which is slower for big packs. - The pack itself is not saved. Reloading the page empties it, only the settings are remembered. - What happens when an item is used is still up to your scripts; the tool only writes the definition. - The codem-inventory folder and file follow CodeM's mInventory Remake docs. Check them against your version. ## Related tools - [Item Icons](/docs/tools/item-icons) for high resolution item art to drop in here. - [Objects List](/docs/tools/objects-list) to find the prop model behind a picture. - [Generators](/docs/tools/generators) when you need ideas for the items a new script uses.