Emergent | Fullstack App

Loading Screen Builder

Server Name

Tagline

Accent Color

#ff6a2c

Discord

Background Image URL (optional)

Server Rules

Live Preview

Vangtech RP

Welcome to the city

Server Rules

1. No RDM / VDM

2. Value your life (NVL)

3. Stay in character at all times

4. No metagaming or powergaming

Loading Screen

index.html for your loadingscreen resource

index.html

HTML

<!-- Vangtech NZ — index.html for your loadingscreen resource -->
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>Vangtech RP</title>
<style>
  * { margin: 0; padding: 0; box-sizing: border-box; font-family: 'Segoe UI', sans-serif; }
  body { height: 100vh; overflow: hidden; color: #fff;
    background: #0a0e14; }
  .overlay { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(8,11,18,.6), rgba(8,11,18,.92)); }
  .wrap { position: relative; height: 100%; display: flex; flex-direction: column;
    justify-content: space-between; padding: 48px 56px; }
  .top { display: flex; align-items: center; gap: 16px; }
  .logo { width: 64px; height: 64px; border-radius: 14px; background: #ff6a2c;
    display: flex; align-items: center; justify-content: center; font-weight: 800; font-size: 26px; }
  h1 { font-size: 34px; letter-spacing: 1px; }
  .tag { color: #94a3b8; margin-top: 4px; }
  .rules { max-width: 520px; }
  .rules h2 { font-size: 15px; text-transform: uppercase; letter-spacing: 2px; color: #ff6a2c; margin-bottom: 16px; }
  .rules ul { list-style: none; display: grid; gap: 12px; }
  .rules li { display: flex; gap: 12px; align-items: center; color: #cbd5e1; font-size: 15px; }
  .rules li span { width: 26px; height: 26px; border-radius: 8px; background: rgba(255,255,255,.08);
    display: grid; place-items: center; font-size: 13px; color: #ff6a2c; }
  .bar { height: 6px; border-radius: 6px; background: rgba(255,255,255,.1); overflow: hidden; }
  .bar > i { display: block; height: 100%; width: 40%; background: #ff6a2c;
    animation: load 2.5s ease-in-out infinite; }
  @keyframes load { 0%{width:5%} 50%{width:85%} 100%{width:5%} }
  .foot { display: flex; justify-content: space-between; align-items: center; color: #64748b; font-size: 13px; }
</style>
</head>
<body>
  <div class="overlay"></div>
  <div class="wrap">
    <div class="top">
      <div class="logo">VA</div>
      <div><h1>Vangtech RP</h1><p class="tag">Welcome to the city</p></div>
    </div>
    <div class="rules">
      <h2>Server Rules</h2>
      <ul>
        <li><span>1</span>No RDM / VDM</li>
        <li><span>2</span>Value your life (NVL)</li>
        <li><span>3</span>Stay in character at all times</li>
        <li><span>4</span>No metagaming or powergaming</li>
        <li><span>5</span>Respect all players & staff</li>
      </ul>
    </div>
    <div>
      <div class="bar"><i></i></div>
      <div class="foot" style="margin-top:14px">
        <span>Connecting to Vangtech RP...</span>
        <span>discord.gg/vangtech</span>
      </div>
    </div>
  </div>
</body>
</html>