Loading Screen

thumbnail-loadingscreen1536×1024 123 KB

WSS-Loadingscreen is a free, open-source loading screen for FiveM.

Fully config-driven from a single config.lua, it gives you video or YouTube background, music, tips, rules, changelogs, keybinds, staff section, and social links. Clean layout, manual shutdown on spawn, and no framework dependency.

Free. Open source. Ready to drop in and customize.

Showcase

(Untitled - Clipped GTA V with Medal.tv)

Why use WSS-Loadingscreen?

• Single config file – no code edits for branding or content

• Background video (local file or YouTube) or no video

• Optional background music with volume control

• Custom tips, server rules, and changelogs (in-app panels)

• Keybinds panel with keyboard layout and descriptions

• Staff section with names, roles, and photos

• Social links (Discord, Tebex, YouTube, X, TikTok, Instagram)

• Themed UI with configurable colors and gradients

• Manual shutdown – closes only when the player has spawned

• No framework required – works on any server

• Fully open source – use and modify as you like

No bloat, no paywall. Configure and go.

Config-driven content

• Branding – Server name, tagline, community name, slogan (can be turned off)

• Video – Local file (e.g. ./videos/background.webm) or YouTube URL; mute and type (auto/local/youtube) in config

• Music – Multiple tracks, volume, all paths in config

• Tips – Single config string shown under the loading panel

• Rules – List of rules, shown in-app when the rules link is #

• Changelogs – Version, date, and bullet list per entry; newest first

• Keybinds – Action, key, and description per bind; optional keyboard layout with per-key info

• Staff – Name, role, optional photo path per entry

• Social – Discord, Tebex, YouTube, X, TikTok, Instagram; leave blank to hide

Sections can be enabled or disabled so you only show what you use.

Theming and layout

• Central loading panel with progress

• Configurable theme: background, panels, cards, borders, accent, text, success/error, gradient

• Optional branding block

• Responsive layout

• Fonts: Orbitron & Rajdhani (customizable via build/CSS)

Easy to match your server’s look by editing the config (and CSS if you rebuild the UI).

How it works

• Server – Sends the whole config to the client via deferrals.handover(Config) on playerConnecting.

• Client – Uses loadscreen_manual_shutdown ‘yes’ and closes the NUI only on playerSpawned, so the loading screen stays until the player has actually spawned.

• UI – Built from React (or your stack) in ui/; output in ui/dist/; no external runtime dependency.

No database, no framework hooks. Just config and one spawn event.

Screenshots

loading11908×1077 91.9 KB

loading21917×1079 117 KB

loading31917×1044 75 KB

Requirements and compatibility

• FiveM – fx_version ‘cerulean’, game ‘gta5’

• No framework – Works on any server

• Build step – If you change the UI source: cd ui && npm install && npm run build

• Files – Ensure ui/dist/index.html, ui/dist/assets/**, and any images / videos / music paths you use are in files in fxmanifest.lua

What’s included

• Full loading screen resource (client, server, config)

• Pre-built UI in ui/dist/

• Single config.lua for all content and toggles

• Example rules, changelogs, keybinds, staff, and social links

• Manual shutdown on playerSpawned

• Open source – modify and redistribute freely

Download and license

Free and fully open source.

• GitHub / download link: ( GitHub - Stretz/wss-loadingscreen: React UI Loading Screen Full Opensource · GitHub )

• License: Use, modify, and redistribute as you like. Credit appreciated but not required.

Support

• Discord: WSS-DEVELOPMENTS

Required information

Developed by WSS-Development