https://github.com/johndev19/box-runner

Box Runner is a fun, browser-based endless runner game built with HTML, CSS, and JavaScript. Players control a box that must jump over obstacles, collect power-ups and survive as long as possible in a changing environment.
https://github.com/johndev19/box-runner

css3 game game-development html5 javascript web-application

Last synced: about 2 months ago
JSON representation

Box Runner is a fun, browser-based endless runner game built with HTML, CSS, and JavaScript. Players control a box that must jump over obstacles, collect power-ups and survive as long as possible in a changing environment.

• Host: GitHub
• URL: https://github.com/johndev19/box-runner
• Owner: JohnDev19
• License: mit
• Created: 2024-10-28T11:47:47.000Z (over 1 year ago)
• Default Branch: main
• Last Pushed: 2024-10-28T11:56:55.000Z (over 1 year ago)
• Last Synced: 2025-03-25T07:14:55.257Z (about 1 year ago)
• Topics: css3, game, game-development, html5, javascript, web-application
• Language: JavaScript
• Homepage: https://boxrunner.vercel.app/
• Size: 159 KB
• Stars: 1
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

          
# Box Runner

Box Runner is a fun, browser-based endless runner game built with HTML, CSS, and JavaScript. Players control a box that must jump over obstacles, collect power-ups and survive as long as possible in a changing environment.

![Desktop](outputdesktop.jpg)

![Mobile](outputmobile.jpg)

## Features

- Simple, one-button gameplay (spacebar or touch to jump)

- Progressively increasing difficulty

- Obstacle generation

- Collectible power-ups for temporary invincibility

- Changing environments (default, winter, desert, beach)

- Day/night mode toggle

- Parallax scrolling background

- Animated elements (running box, floating clouds, flying birds)

- Score tracking and game over screen

## How to Play

1. Open the `index.html` file in a modern web browser.

2. Press the spacebar or tap the screen (on mobile devices) to make the box jump.

3. Avoid obstacles by timing your jumps correctly.

4. Collect golden power-up orbs for temporary invincibility.

5. Try to achieve the highest score possible!

## Game Elements

- **Box**: The player character you control

- **Obstacles**: Some objects you must jump over

- **Power-ups**: Golden orbs that grant temporary invincibility

- **Trees**: Decorative elements that appear randomly

- **Birds**: Flying creatures that add to the game's atmosphere

- **Clouds**: Floating elements in the background

## Technical Details

The game is built using the following technologies:

- HTML5

- CSS3 (with animations and SVG graphics)

- JavaScript (ES6+)

## Future Enhancements

- Add sound effects and background music

- Implement different types of obstacles and power-ups

- Create a leaderboard system

- Add touch controls for mobile devices

- Optimize performance for smoother gameplay on lower-end devices

## Contributing

Contributions to Box Runner are welcome! Please feel free to submit a Pull Request.

## License

This project is open source and available under the [MIT License](LICENSE).

## Credits

Created by JohnDev19 (JOHN RÉ)  as a fun project to explore game development with web technologies.