🎮ArcadeLab

3D Sport Racer

by ChromeMeteor64
114 lines1.6 KB
▶ Play
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>3D Sport Racer</title>

<style>
*{
  box-sizing:border-box;
  margin:0;
  padding:0;
}

body{
  overflow:hidden;
  background:#111;
  font-family:Arial,sans-serif;
  touch-action:none;
}

canvas{
  display:block;
  width:100vw;
  height:100vh;
  background:#87ceeb;
}

#menu{
  position:fixed;
  inset:0;
  display:flex;
  align-items:center;
  justify-content:center;
  flex-direction:column;
  background:linear-gradient(#111a,#000e);
  color:white;
  z-index:10;
}

#menu h1{
  font-size:42px;
  margin-bottom:30px;
  text-shadow:0 0 15px #fff;
}

button{
  border:0;
  border-radius:15px;
  padding:15px 35px;
  margin:8px;
  font-size:20px;
  font-weight:bold;
  cursor:pointer;
}

#play{
  background:#00d084;
  color:white;
}

#restart{
  display:none;
  position:fixed;
  z-index:20;
  left:50%;
  top:58%;
  transform:translateX(-50%);
}

#controls{
  position:fixed;
  bottom:20px;
  left:0;
  right:0;
  display:none;
  justify-content:space-between;
  padding:0 25px;
  z-index:5;
}

.controlGroup{
  display:flex;
  gap:12px;
}

.control{
  width:65px;
  height:65px;
  border-radius:50%;
  background:#ffffff55;
  color:white;
  border:2px solid white;
  font-size:27px;
  display:flex;
  align-items:center;
  justify-content:center;
  user-select:none;
}

#hud{
  position:fixed;
  top:15px;
  left:15px;
  color:white;
  font-size:18px;
  background:#0008;
  padding:12px 16px;
  border-radius:10px;
  display:none;
  z-index:5;
}
</style>
</

Game Source: 3D Sport Racer

Creator: ChromeMeteor64

Libraries: none

Complexity: moderate (114 lines, 1.6 KB)

The full source code is displayed above on this page.

Remix Instructions

To remix this game, copy the source code above and modify it. Add a ARCADELAB header at the top with "remix_of: 3d-sport-racer-chromemeteor64" to link back to the original. Then publish at arcadelab.ai/publish.