Multicharacter
Theme and Branding
config/theme.lua and your logo - colors, radius, font, effects, and what the ready UI build lets you change.
On this page5 sections
The whole UI reads colors and styles from config/theme.lua: character select, creator, spawn selector, and loading screen. One change updates everything, with no rebuild.
SleepyCodeTheme = { colors = { accent = '#9C8FD6', bg = '#0A0A0C', surface = '#16161A', text = '#F6F5F2', muted = '#A8A8B0', border = '#35353E', danger = '#B5544F', warning = '#C7913A', info = '#9C8FD6', }, radius = { sm = 6, md = 10, lg = 16, xl = 16 }, logo = '', logo_mark = '', font = 'manrope', font_scale = 1.0, panel_alpha = 0.94, effects = { glow = false, blur = true, motion = true, }, toast_pos = 'top-right',}Colors
| Key | Where |
|---|---|
accent | Highlights: selected row, focus, links, hovered main button |
bg | Page background |
surface | Panels and cards |
text | Main text |
muted | Secondary text |
border | Borders |
danger | Errors and destructive actions such as delete |
warning | Warnings |
info | Information |
Other options
| Option | Description |
|---|---|
radius | Corner radius in px: sm small elements, md controls, lg and xl cards and panels. |
logo | Wide logo on character select, for example 'logo/my-server.png'. Empty uses the SleepyCode artwork. |
logo_mark | Square badge on the loading screen. Empty uses logo. |
font | 'manrope' (default), 'inter', or 'fira'. |
font_scale | Scales all text. 1.0 is default, 1.1 is 10% larger. |
panel_alpha | Panel opacity from 0 to 1. |
effects.glow | Accent glow on the main button. |
effects.blur | Background blur behind panels. Disable for weaker PCs. |
effects.motion | UI animations. false disables them, including the curtain intro. |
toast_pos | 'top-right', 'top-left', 'bottom-right', 'bottom-left', or 'top-center'. |
Example server theme
SleepyCodeTheme = { colors = { accent = '#E8B04A', bg = '#0B0D10', surface = '#14171C', text = '#F2F2F2', muted = '#9AA0A6', border = '#2A2F36', danger = '#D9534F', warning = '#E8B04A', info = '#5BA4E6', }, radius = { sm = 4, md = 6, lg = 10, xl = 10 }, logo = 'logo/my-server.png', logo_mark = 'logo/my-server-icon.png', font = 'inter', font_scale = 1.0, panel_alpha = 0.9, effects = { glow = true, blur = true, motion = true }, toast_pos = 'top-right',}Your logo
| Field | Where | Recommended format |
|---|---|---|
logo | Character select and the curtain intro | Wide, about 3:1 to 6:1, shown at about 32-40 px height |
logo_mark | Center of the loading screen | Square. Empty uses a smaller logo. |
Formats: SVG, PNG, WebP, and JPG. SVG or a 2x PNG stays sharp on 4K screens. Use a transparent background.
What the UI build lets you change
The UI ships as a ready, compiled build in web/dist/. The UI source is not part of the package.
| I want to change | Where |
|---|---|
| Colors, radius, font, opacity, animations | config/theme.lua |
| Logo | web/dist/logo/ and config/theme.lua |
| Any UI text | locale/*.json, see Translations |
| Loading screen content | web/dist/loadingscreen.json, see Loading Screen |
| Menu and intro music | web/dist/audio/ |
| Spawn location photos | Automatic or web/dist/spawnmap/ |
| Nationalities and flags | config/identity.lua and web/dist/flags/ |
| Scenes, camera animations, filters | config/camera.lua |
| Spawn locations | config/spawn.lua |
Without the source, you cannot change screen layout, add creator form fields, or add new screens. Contact us on Discord if you need that.