> Source: https://fivemad.com/docs/tools/drawable-studio > Section: Tools > Tags: 3D, CodeWalker, materials, lights, ydr, yft > Tool: https://fivemad.com/tools/drawable-studio > Last updated: 2026-09-24 > Site map for assistants: https://fivemad.com/llms.txt # Drawable Studio How to open a CodeWalker XML export (.ydr, .ydd, .yft) in 3D, check geometry and textures, edit shaders and lights, paint textures and export the result. Drawable Studio opens a CodeWalker XML export of a model with its textures and shows it in 3D in your browser. You can check geometry, LODs and textures, change shader parameters and texture slots, add or move light effects, paint straight onto the model, and export the edited XML, the textures as DDS or PNG, or a GLB. It is for prop, vehicle and map makers who want to inspect or tweak a model without opening a 3D package. ## What it is for - **Checking a model before you ship it.** Missing textures, empty LODs, wrong shader, a texture at 4096 that should be 1024: the Scene tab shows all of it at a glance. - **Small material fixes.** Too shiny, normal map too strong, glow too weak: change `specularIntensityMult`, `bumpiness` or `emissiveMultiplier` and see it live. - **Lamps on props.** Add a light to a streetlight or a sign, move it with a gizmo, set the hours it is on. - **Quick texture touch ups.** Paint over a logo, fix a seam, recolour a part, then export the texture under its original name. Everything is read in your browser. Nothing is uploaded. ## Export the model from CodeWalker The tool reads CodeWalker's XML format, not the binary files. 1. Open CodeWalker's RPF Explorer (or the project window for your own files) and find the `.ydr`, `.ydd` or `.yft`. 2. Right click it and pick **Export XML**. CodeWalker writes `name.yft.xml` and a folder `name/` with the textures as DDS. 3. Vehicles and most props keep their textures in a separate `.ytd`. Export that one too; it gives you a `.ytd.xml` and the same kind of DDS folder. 4. Drop everything on the viewer together, or use **Choose folder**. Textures are matched to shaders by name, so the folder layout does not matter. ## Quick start 1. Open the [tool](/tools/drawable-studio). 2. Click **Choose folder** and pick the export folder, or drop it on the viewer. **Choose files** takes `.xml`, `.dds`, `.png`, `.jpg` and `.jpeg` files. 3. Wait for the progress bar (reading, parsing, decoding textures). A message tells you how many textures are missing, if any. 4. Look around, then switch between the **Scene**, **Materials**, **Lights** and **Paint** tabs on the right. 5. When you are done, press **Export XML**, **Package .zip** or **GLB** in the bar above the viewer. > [!TIP] > Forgot the texture folder? Drop the DDS files (or the folder) on the viewer while the model is open. They are added to the current model and the toast says how many missing textures they filled in. ## Inputs | File | Used for | | --- | --- | | `.ydr.xml`, `.ydd.xml`, `.yft.xml` | The model. If a drop holds several model XML files, one model is opened. | | `.ytd.xml` | Format info for textures that live in a separate dictionary. | | `.dds` | Textures: DXT1, DXT3, DXT5, BC4, BC5, A8R8G8B8 and other uncompressed formats. | | `.png`, `.jpg` | Textures too, matched by file name. | BC7 textures are not supported yet; they show as unsupported in the texture list. ## The viewport Drag to orbit, right drag to pan, the wheel zooms. Click a mesh to select it; its shader is selected in the Materials tab too. Top left is the LOD switcher: **High**, **Med**, **Low**, **VLow**. LODs the file does not have are greyed out. Top right: | Button | What it does | | --- | --- | | Background colour | Colour picker for the viewer background. | | Wireframe | Draws the mesh edges. | | Night preview | Dark sky, so lights and emissive shaders stand out. | | Frame model | Moves the camera to fit the model. | | Save screenshot (PNG) | Downloads the current view as `.png`. | The bottom bar shows vertices, triangles, shaders and textures for the current LOD, plus how many textures are missing. The model is shown the way the game places it: rigid parts on their bones, vehicle wheels on every wheel bone. Skinned meshes (peds, most vehicle bodies) are shown in their bind pose. Missing textures render as a pink checker. The bar above the viewport shows the file name, a counter of your changes, the export buttons and an X to close the file. Opening another file or closing with unsaved changes asks first. ## Scene tab ### Model File name, type (Drawable, Drawable dictionary or Fragment), number of drawables, bones, lights and shaders, and how long the file took to read. Warnings from reading the file show here too. ### Display | Option | What it does | | --- | --- | | **Textured**, **Clay**, **Normals**, **UV checker**, **Vertex colour** | View modes. Clay hides textures to judge the shape, UV checker shows stretching, Vertex colour shows the painted vertex data. | | **Wireframe overlay** | Same as the viewport button. | | **Ground grid** | On by default. | | **Night preview** | Same as the viewport button. | | **Paint colour** | Only for models with `vehicle_paint` shaders. Preview only: in game the colour comes from the vehicle's paint. | ### Geometry Every geometry of the current LOD, grouped by drawable, with shader name and index, vertex and triangle count and the bone it sits on. The eye hides or shows a geometry, **Show all** and **Hide all** do it for the whole list, and **Solo** (in `.ydd` files) shows only one drawable. Click a row to select it in the viewport. ### Textures A grid of every texture the shaders use, with format and size. The dot is green when the texture is fine, amber when you edited it, red when it is missing or could not be read. Click a texture to open the texture window: - **Color**, **RGB** and **Alpha** channel views. - **Used by**: which shader slots point at it. - **File**: where it was loaded from. - **PNG** and **DDS for CodeWalker** downloads. - **Replace with image** (PNG, JPG or WebP) and **Revert changes**. ## Materials tab Click a shader (or a mesh in the viewport) to expand it. Each shader row shows its index, name, `.sps` file, render bucket (opaque, alpha, decal, cutout and so on) and how many meshes use it. Pills tell you the alpha mode, glass, emissive (or emissive at night) and vehicle paint. Inside you get every parameter: - **Texture slots**: the texture name in a text field with suggestions from the loaded textures. Type another name to point the slot at a different texture. The image button replaces the texture's pixels with a PNG, JPG or WebP (the name stays the same). A download button appears once the texture is edited. The line below says the format and size, or `file not dropped`, or `unknown texture, add it to a .ytd`. - **Vectors**: a single number for scalar values, with an **xyzw** button to edit all four components. - **Arrays**: listed and kept as they are. Parameters marked **live** change the preview: the diffuse, normal and spec maps, `bumpiness`, `specularIntensityMult`, `specularFalloffMult` and `emissiveMultiplier`. Every other change is written to the exported XML only. Hover a parameter name for a short hint (for example `specularFalloffMult`: specular tightness, higher is glossier). Each changed value has a reset button, and **Reset shader** undoes all changes of one shader. **Textures for your .ytd** lists every texture you painted or replaced, with **DDS** and **PNG** downloads and where it belongs: embedded in the model, replace in the `.ytd`, or add to a `.ytd`. New texture names you typed into a slot that have no file show up as `needs a texture`. The preview is an approximation, not the game's shaders. Check the final look in game. ## Lights tab Shows the `` block of the model as real lights in the scene. With several drawables that have lights, a **Drawable** selector picks which one you edit. - **Add light** creates a point light above the model, sized to it. - Each light row shows its colour, type, bone, intensity and range, with duplicate and delete buttons. - **Night preview** dims the sky, **Light gizmos** shows or hides the light helpers. Pick a light in the list or click it in the viewport. Move it with the gizmo (switch between move and rotate with the two buttons in the light's header) or type values. | Section | Fields | | --- | --- | | Light | **Type** (Point, Spot, Capsule), **Colour**, **Intensity**, **Bone**, **Position**, **Direction**, **Tangent**. Spot lights add **Cone inner (deg)** and **Cone outer (deg)**, capsules add **Extent**. | | On hours (TimeFlags) | 24 buttons, one per hour. **Always** and **Night 20 to 6** presets. | | Falloff | **Range (m)**, **Falloff exponent**, **Flashiness** | | Corona | **Size**, **Intensity**, **Z bias** | | Volume | **Intensity**, **Size scale**, **Outer intensity**, **Outer exponent**, **Outer colour** | | Shadows | **Blur**, **Near clip** | | Fade distances | **Light**, **Shadow**, **Specular**, **Volumetric** | | Advanced | **Flags**, **Light hash**, **Group id**, **Time flags**, **Projected texture**, plus any other fields the file has | Positions and directions are relative to the bone in `BoneId`, the same as in the file. Light brightness in the viewer is an estimate. ## Paint tab | Control | What it does | Default | | --- | --- | --- | | **Texture** | Which texture you paint on. Diffuse textures are listed first, others are marked `non-diffuse`. When you open the tab the largest diffuse is picked. | | | **Pick on model** | Click a mesh in the viewport to paint its diffuse texture. | | | Brush (B) | Paints the colour. | | | Eraser (E) | Paints the original texture back. | | | Fill (G) | Flood fill with **Tolerance** (0 to 128). | 24 | | Eyedropper (I) | Picks a colour and switches back to the brush. | | | Colour | Brush colour. | `#e23b3b` | | **Size** | Brush size in texture pixels, up to half the texture size (max 512). | 48 | | **Hardness** | Edge softness. | 0.6 | | **Opacity** | Stroke opacity. | 1 | | **Mirror X** | Paints the other side of a symmetric model too (3D view only). | Off | Left drag on the model paints, right drag orbits, middle drag pans, the wheel zooms. **Texture view** shows the flat texture with an optional **UV wireframe**; you can paint there too. Below it: download `.png`, **DDS**, and **Revert to the original texture**. Keys in the Paint tab: Ctrl + Z undo, Ctrl + Y or Ctrl + Shift + Z redo, [ and ] brush size. ## Output | Button | File | What is inside | | --- | --- | --- | | **Export XML** | Same name as the XML you opened, for example `prop_streetlight_01.ydr.xml` | The original file with only the values you changed rewritten. Everything else stays byte for byte, so diffs stay small. | | **Package .zip** | `_edited.zip` | The edited XML plus `/.dds` for every texture you painted or replaced. | | **GLB** | `_.glb`, for example `adder_high.glb` | The current LOD with textures, for Blender or other tools. One way only. | Exported DDS files keep the texture name and the format family of the original (DXT1, DXT5 or A8R8G8B8) and get a full mip chain. A DXT1 texture you painted with transparency becomes DXT5. When you replace a texture with an image of a different size, the XML export updates the size of embedded textures. ## Getting your edits back into the game 1. Extract **Package .zip** over your CodeWalker export folder, so the XML and the `/` texture folder get replaced. 2. In CodeWalker, use **Import XML** and pick the `.ydr.xml`, `.ydd.xml` or `.yft.xml`. It builds the binary file again. 3. Textures that live in a separate `.ytd` are not part of the model. Open that `.ytd` in CodeWalker or OpenIV and replace the texture with the PNG or DDS of the same name, or use the [Texture Editor](/docs/tools/texture-editor). The Materials tab lists which textures need this. 4. Copy the rebuilt files into your resource's `stream/` folder and restart the resource. ```bash fivemad_props/ fxmanifest.lua stream/ prop_my_lamp.ydr prop_my_lamp.ytd fivemad_props.ytyp ``` FiveM streams everything in `stream/` automatically. A new prop (not a replacement of a game model) also needs an archetype in a `.ytyp`, loaded from the manifest: ```lua title="fxmanifest.lua" fx_version 'cerulean' game 'gta5' data_file 'DLC_ITYP_REQUEST' 'stream/fivemad_props.ytyp' ``` The [YTYP Creator](/docs/tools/ytyp-creator) builds that file. ## Tips - Drop the whole export folder, not single files. That way every texture, including the separate `.ytd` ones, is found in one go. - Use **Clay** and **UV checker** to spot bad normals and stretched UVs before you blame the texture. - For lights, turn on **Night preview** and set the hours with **Night 20 to 6** so street lamps do not burn at noon. - **Solo** in a `.ydd` is the fastest way to check one drawable of a clothing or ped dictionary. ## Common mistakes - **Only the XML dropped.** Every texture shows as a pink checker. Drop the texture folder on the open model. - **Edited `.ytd` textures forgotten.** Painting a texture that lives in a separate `.ytd` does not change the model file. Export the DDS or PNG and put it into the `.ytd`. - **Renamed texture that does not exist.** Typing a new name into a slot only changes the reference. Add a texture with that name to a `.ytd`, or the game draws nothing. ## Limitations - Reads CodeWalker XML exports only, not binary `.ydr`, `.ydd` or `.yft` files. - BC7 textures are not supported yet. - Geometry can not be edited. Skinned meshes are shown in their bind pose. - The 3D preview and the light brightness are estimates of the in game look. - Everything runs in your browser and nothing is uploaded. ## Related tools - [Texture Editor](/docs/tools/texture-editor) for editing the `.ytd` dictionaries that go with the model. - [YTYP Creator](/docs/tools/ytyp-creator) for the archetype of a new prop. - [Clothing Designer](/docs/tools/clothing-designer) for painting clothing with layers from binary `.ydd` files. - [YTD Optimizer](/docs/tools/ytd-optimizer) to shrink texture memory. - [Objects List](/docs/tools/objects-list) to find game props with pictures and 3D previews.