Skip to main content

​
The First Impression

The loading screen is the first interaction a player has with your community. By replacing the default FiveM loader with a custom NUI (Native User Interface) screen, you can introduce your rules, showcase community artwork, and play immersive background music.
Reading TimeDifficultyLast Updated
7 minutesIntermediateJanuary 2026

​
1. Resource Foundation

Create a folder named freak_loadscreen in your /resources/ directory. It should contain:
  • fxmanifest.lua: The resource configuration.
  • index.html: The visual layout.
  • style.css: The styling and animations.
  • music.mp3: Your background track.

​
2. Defining the Manifest

Your fxmanifest.lua must explicitly tell the game that this resource is a loading screen: 
fx_version 'cerulean'
games { 'gta5' }

loadscreen 'index.html'

files {
    'index.html',
    'style.css',
    'music.mp3',
    'images/*.png'
}

​
3. HTML Structure

Your index.html is a standard web page. You can use CSS animations to create a dynamic background: 
<!DOCTYPE html>
<html>
<head>
    <link rel="stylesheet" href="style.css">
</head>
<body>
    <div id="container">
        <h1>Welcome to FREAKHOSTING RP</h1>
        <p>Press ESC for rules | Joining world...</p>
    </div>
    
    <audio id="bgm" src="music.mp3" autoplay loop></audio>
    <script>
        document.getElementById("bgm").volume = 0.3; // Gentle volume
    </script>
</body>
</html>

​
Audio Etiquette

Nothing ruins an experience faster than loud, un-skippable music. Always set the default volume in your script to 0.3 (30%) or lower, and consider adding a simple mute button in your HTML so players can enjoy their own music while joining.

​
Support Channels

If you need assistance or have any questions, please contact our support team:

​
First Month Discount

Use code KB20 at checkout to get 20% off your first month of hosting!
Last Updated: January 2026 | FiveM: Branding active.