Build your game UI like a web page, rendered natively in Unreal.

HTML UI brings RmlUi, a lightweight HTML/CSS-style UI library, into Unreal Engine 5. You write layouts in RML (HTML-like markup) and style them with RCSS (CSS-like stylesheets). It all draws through Slate as a regular UMG widget. There is no embedded web browser and no JavaScript runtime. Memory use stays small and performance is suitable for games.

Design with familiar tools

• Flexbox, tables, floats, absolute positioning, scrolling and overflow

• Borders, rounded corners, images, sprite sheets, nine-patch and tiled decorators

• CSS transitions, keyframe animations and transforms

• Text fields, checkboxes, radio buttons, sliders, dropdowns, progress bars and tab sets

• Font effects (outline, glow, shadow), emoji fallback and custom fonts through @font-face

• Theme switching with media queries

Built for Blueprint

• RmlUi Document UMG widget with a file browser for choosing the document and a live preview in the Widget Designer

• On Rml Event: inline handlers such as onclick="start_game" fire straight into your Blueprint graph

• Rml Element handles: find elements by id or CSS selector, then change text, markup, classes, styles, attributes and form values, focus, click or add listeners

• Data models with two-way binding: push values, arrays or any struct from Blueprint, and the page updates itself through {{ }}, data-for, data-if and data-value. Buttons can call Blueprint events with arguments

Unreal integration

• Show Unreal textures and render targets directly: <img src="/Game/UI/T_Icon.T_Icon"/>

• Mouse, keyboard, text input, clipboard and cursor styles all work

• Clicks on empty areas pass through to the game, so a full-screen HUD won't block gameplay input

• DPI-aware dp units that follow UMG's DPI scaling, with text rasterised sharp at every scale

• Works in world-space UI through Widget Components

Fast iteration

• Built-in visual debugger (element inspector and log), toggled with F10

• Hot reload of every document and stylesheet with one console command or Blueprint node

• Example documents and a ready-made base stylesheet included

Included

• Full C++ source, including the unmodified RmlUi 6.3 SDK (MIT licence)

• Lato and Noto Emoji fonts (SIL Open Font License)

• Example menu and data-binding documents

• Documentation

Limitations (current version)

box-shadow, gradients, filter/backdrop-filter and clipping inside rounded or rotated elements are not rendered yet.