> For the complete documentation index, see [llms.txt](https://pinkfrog.gitbook.io/pinkfrog.io/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://pinkfrog.gitbook.io/pinkfrog.io/assets-and-guides/loading-screen-pinkfrog_loadingscreen.md).

# Loading Screen (pinkFrog\_loadingScreen)

{% embed url="<https://www.youtube.com/watch?v=L-AGHMwWXTI>" %}

### PinkFrog Loading Screen

**PinkFrog Loading Screen**is a modern and fully customizable loading screen for FiveM servers designed to create a strong first impression before players even join the game.

This system presents important server information, builds atmosphere, and showcases the professionalism of your project from the first seconds of joining.

### Key Features

* Modern HTML-based UI with smooth animations
* Player statistics and activity ranking based on time spent
* 3D animated keybind showcase
* Interactive community gallery
* Server updates and changelog panel
* Animated staff showcase
* Built-in music player with playlist support
* Social media links with FiveM confirmation dialog

#### Player Statistics

* Activity ranking based on playtime
* Total time spent on the server
* Distance driven by the player
* Total owned money (cash + bank)

Statistics are written to the database only when a player leaves the server, which prevents constant database writes and keeps the system lightweight.

#### 3D Keybind Showcase

* Animated keyboard module
* Hover key highlights with descriptions
* Fully customizable keybind list

#### Community Gallery

* Interactive gallery with server screenshots
* Images added easily through config URLs
* Smooth gallery navigation and animations

#### Updates / Changelog Panel

* Display server updates directly in the loading screen
* Version numbers, dates, and change lists
* Ideal for changelogs and announcements

#### Staff Panel

* Animated staff cards
* Custom names, ranks, and images
* Fully configurable in the config file

### Customization

The loading screen was designed so server owners can easily customize it without programming knowledge.

#### UI Modules

* Keyboard module
* Keybind highlights
* Staff panel
* Updates panel
* Statistics panel
* Gallery panel
* Social links
* Progress bar

All modules can be enabled or disabled in the configuration.

#### Background Modes

* Video background using MP4 files
* Fullscreen background image slider
* Multiple images supported

#### Theme System

* Main accent color
* Bright accent color
* Dark accent color
* Optional logo recoloring

This allows the loading screen to match your server branding in seconds.

#### Additional Configuration

* Server help texts
* Staff members and images
* Server keybinds
* Music playlist
* Social media links
* Default volume level
* Distance units (KMH or MPH)
* Default starting panel
* UI language

### Localization

* English language support
* Polish language support
* Editable translation system

### Integration

* PinkFrog Multicharacter support

This integration removes awkward transitions and provides a smoother player entry experience.

### Framework Support

* ESX
* QBCore
* QBOX

<br>

**Upgrade your server experience with PinkFrog Loading Screen.**