An interactive 3D science exhibit inspired by the Large Hadron Collider and ATLAS.
Live demo: https://bubblik525.github.io/collider/
Download ATELIER-Collider.html and open it in a modern browser with WebGL enabled. JavaScript and CSS are embedded; no server or internet connection is required.
- Detector: 12 switchable systems, 5,212 individually animated components and a six-stage disassembly.
- Collider: a schematic accelerator ring, counter-rotating beams, magnet disassembly and an orbiting camera.
- Collision: illustrative particle tracks with pause and event generation controls.
Drag to orbit, scroll or use the slider to disassemble. Choose 30, 60 or 90 seconds for playback, or use Reassemble slowly.
Requires Node.js 22.12+ (Node.js 24 recommended) and pnpm 11.19.0.
pnpm install --frozen-lockfile
pnpm run buildThe build regenerates ATELIER-Collider.html. Temporary output stays in .build/ and is excluded from Git.
This is a conceptual visualization, not a physics simulation, engineering model or official CERN product. Geometry, animation speeds and collision tracks are illustrative.
References: CERN — LHC, ATLAS schematics, ATLAS magnet system.
The application includes no analytics, authentication, cookies or telemetry. External reference links are opened only when clicked. Third-party library notices are in THIRD_PARTY_NOTICES.md.