Neon Racing

3D arcade racer with drifting, nitro and three rival cars — three.js

Overview

A 3D arcade racer on a sunny seaside circuit: three laps against three computer cars, drift boosts, nitro, boost pads, live positions and a mini-map. Three difficulty levels, touch and keyboard controls, music and engine sound.

  • Real-time 3D seaside circuit with soft shadows, sky lighting, palms, grandstands and tyre walls
  • Three laps against three computer cars with their own racing lines and close-race balancing
  • Three difficulty levels (Easy, Normal, Hard)
  • Drift-to-boost system with three charge levels, nitro bar and boost pads
  • Start lights, lap times, best lap record, live standings, mini-map and speedometer
  • Engine sound cross-faded with speed, tyre squeal, crowd, music and sound effects
  • Touch buttons on phones, keyboard on desktop, automatic graphics quality and a 2D fallback
  • Track defined by a list of control points — design new circuits in minutes

Requirements

  • A browser with WebGL (all current desktop and mobile browsers); a 2D view is used otherwise
  • Serve over http(s) — any static host or a local server (3D models are loaded with fetch)

Technology: three.js r159 · WebGL · Web Audio · JavaScript.

Quick start

  1. Unzip the package.
  2. Put your licence key and production domain in LICENSING/licence.json (see Licence activation).
  3. Upload the game/ and LICENSING/ folders side by side to your web host, for example to /games/neon-racing/.
  4. Open https://your-site.com/games/neon-racing/game/index.html. No install, no database, no server code.

To try it on your computer first, start any local web server in the unzipped package folder (localhost is always allowed):

python3 -m http.server 8080
# then open http://localhost:8080/game/index.html

Opened straight from disk (file://) browsers refuse to load the 3D models, so the game falls back to its 2D view — always test through a web server.

Licence activation

  1. Open LICENSING/licence.json and set key to the licence key from your purchase e-mail and domain to your production hostname (for example example.com — no https://, path or port).
  2. Keep the LICENSING/ folder next to game/ on your server; game/index.html loads ../LICENSING/check.js.
  3. Open the game on your domain once — the first production visit activates the key for that domain. The check needs an internet connection; allow https://vortaxis.com in your Content-Security-Policy connect-src if you use one.
  4. Moving to another domain? Request a transfer at vortaxis.com/licence/.

Details: LICENSING/README.txt. The check is an editable compliance check, not tamper-proof DRM; the licence terms apply even if the code is changed.

How to play & controls

The car accelerates by itself. Steer with ← → (or A D), hold Space or Shift in a corner to drift and charge a mini-boost, let go to fire it. ↑ / W fires a nitro bar, ↓ / S brakes. On phones use the on-screen buttons. Three laps — finish first!

Steer← / → or A / D · ◀ ▶ buttons on touch screens
Drift (charge a boost)Hold Space or Shift in a corner, release to boost · DRIFT button
Nitro↑, W or E · NITRO button
Brake↓ or S · BRAKE button
Start / sound / menuEnter or Space on the grid · M for sound · menu button in the corner

File structure

game/index.htmlThe page: start menu and the GAME_CONFIG settings (texts, difficulty levels, colours).
game/host.js · game/host.cssThe host: start menu, loading, pause on tab switch, result card.
game/games/neon-racing/game.jsThe game: track, car physics, computer drivers, 3D and 2D views, HUD, touch controls, sound.
game/games/neon-racing/assets/v2/models/3D cars and track-side props (GLB, 8 files).
game/games/neon-racing/assets/v2/tex/ · env/Ground, road and sky textures (WebP).
game/games/neon-racing/assets/v2/audio/Music, engine loops and sound effects (MP3, 18 files).
game/vendor/three.js r159 and GLTFLoader (MIT).
game/fonts/Inter and Unbounded, self-hosted (OFL).
LICENSING/Licence key + domain activation (check.js, licence.json, README.txt).
documentation/index.htmlThis documentation.
LICENSE.txt · THIRD-PARTY.txt · CHANGELOG.mdLicence terms, bundled components, version history.

Configuration

The start menu is driven by window.GAME_CONFIG in game/index.html:

name, titleHtml, kicker, lead, howToTexts of the start menu (titleHtml may use <em> for the coloured word).
levelsDifficulty buttons: [key, label, hint]. The keys the game knows: easy, normal, hard.
defaultLevelLevel selected on the first visit (the player's last choice is remembered).
backUrl (optional)Adds a "← All games" link to the start menu.

Colours: --acc and --acc2 in the <style> line of index.html; --menu-bg is the menu background picture.

Customise & rebrand

Gameplay settings live near the top of game/games/neon-racing/game.js. Search for these names:

LAPSLaps per race (3).
TRACK_PTSThe circuit: control points of a closed curve in metres — move, add or remove points to design a new track.
VMAX / ACCEL / BRAKE / BOOST_VTop speed, acceleration, braking and boost speed.
TURN / GRIP / DRIFT_GRIPSteering and grip, normal and while drifting.
CHARGE / CHARGE_BOOSTDrift time needed for each boost level and the boost length.
RIVALS / PLAYERNames, car models, colours, skill and lane of each car.
aiKSpeed factor of the computer cars for each difficulty level.

Art and sound

Replace files in game/games/neon-racing/assets/v2/ with your own, keeping the same names and formats (GLB models facing +X, WebP textures, MP3 sound).

Name and credit

Change the <title>, the meta description and the menu texts in game/index.html. The small "Made by Vortaxis Studio" credit may be kept or removed.

Embed in a page

<iframe src="/games/neon-racing/game/index.html" title="Neon Racing"
        width="100%" height="680" allow="fullscreen; autoplay"
        style="border:0;border-radius:16px"></iframe>

Game portals

Add the portal SDK calls in host.js (game start, result, pause).

FAQ

Does it need a server or database?

No server code and no database: it is static HTML, CSS and JavaScript on any web host. Production use needs the included licence activation (one HTTPS check from the browser).

Are scores shared online?

No. The best lap and best score are stored in the player's browser (localStorage). There are no accounts, no online features and no ads.

Can I change the art, colours and texts?

Yes. The menu texts and colours are in index.html, the track, cars and physics are constants at the top of game.js, and all models, textures and sounds are plain files you can replace.

Does it work on phones?

Yes — touch, mouse and keyboard controls, portrait and landscape, high-DPI screens.

What is the difference between Licence and Full source?

Both cover ONE production domain per purchase. Licence = one end product on that domain. Full source adds editable-source rights plus white-label, paid and SaaS use on that domain. Neither allows reselling the game or its source, and neither is an unlimited-installation licence.

Can I put it on game portals and show ads?

Yes, in your own end product on your licensed domain. Add the portal SDK calls in host.js (game start, result, pause).

Licence

Each purchase (and its licence key) covers one production domain. Licence: use the game in one end product on that domain (yours or one client's). Full source: adds editable-source rights, white-label, paid and SaaS use on that same domain. Neither option allows reselling or redistributing the game or its source, and neither is an unlimited-installation licence. localhost, loopback, *.localhost and *.test hosts are free for development. Full terms: LICENSE.txt and vortaxis.com/licenses.php.

Support & updates

Updates are free. Questions are answered for 6 months after purchase (12 months with Full source) — write to hello@vortaxis.com or use vortaxis.com/store/neon-racing. Need a custom version (your art, extra levels, a portal SDK)? Ask for a quote.