MTA DX Designer
Draw your screen the way you want it, then copy the dxDraw Lua for it. Rectangles, text, images, lines and circles, with the code written to fit any resolution. Everything happens in this tab: nothing is uploaded and nothing is saved anywhere but your own browser.
Drag to move, drag a corner to resize, arrow keys nudge, Delete removes. to design on top of it (it stays on your computer).
The Lua
What the code does
MTA draws to the screen every frame, so the whole layout goes inside an onClientRender handler in a client script. Put the file in your resource, add it to meta.xml as <script src="hud.lua" type="client" />, and it draws as soon as the resource starts.
Why relative is the default
People play on everything from 1366 × 768 to 4K. Numbers written straight into dxDrawRectangle sit in the wrong place on every screen except yours. The relative code asks the game for the screen size with guiGetScreenSize() and works out the position from it, so the layout lands in the same place for everyone. Absolute is there for when you want the exact pixels you drew.
Fonts
MTA ships its own fonts: default, default-bold, clear, arial, sans, pricedown, bankgothic, diploma and beckett. Those files belong to the game and are not ours to hand out, so the preview here uses lookalikes and the code names the real font. The size on screen will be close, not exact.
Images
An image part writes dxDrawImage with the path you type. The file lives in your resource and goes in meta.xml as <file src="logo.png" />. Loading a picture here is only so you can see it while you design; it never leaves your computer.
Building something that needs coordinates instead? The coordinates map gives you X and Y for anywhere in San Andreas.