Module C3 · Interfaces (NUI)

DUI: render live HTML on 3D surfaces

Full-screen NUI paints a webpage over the whole screen. DUI paints a webpage onto a single GTA texture instead, so the page becomes a surface in the world: a TV, a billboard, an advert, a dashboard. The browser is the same one NUI uses. The only thing that changes is where the pixels land. This lesson builds the smallest honest DUI: a live HTML clock that replaces a prop's texture so it ticks in the world, then takes the native chain apart so you can point it at any texture you like.

You'll build: A resource that renders a live HTML clock onto an in-world texture, so a billboard prop shows a webpage you control instead of its baked GTA texture.
Time: ~28 minutes
You need: The NUI lessons done. You should already know SetNuiFocus, SendNUIMessage, RegisterNUICallback, and the cfx-nui callback URL format. DUI reuses the same web stack, just pointed at a texture instead of the screen.
You'll learn: What DUI is and how it differs from full-screen NUI -> the native chain CreateDui -> GetDuiHandle -> CreateRuntimeTxd -> CreateRuntimeTextureFromDuiHandle -> AddReplaceTexture -> how to push updates with SendDuiMessage, swap pages with SetDuiUrl, and clean up with DestroyDui

BEFORE YOU START

DUI vs NUI: pick the right tool

Both use the same embedded Chromium browser the runtime ships with. The difference is the render target.

DUI vs NUI: pick the right tool

Keep reading the full lesson