A delightful Tic-Tac-Toe game featuring adorable critter characters (Ladybug vs Bumblebee) with score tracking and symbol randomization!
- 🎮 Two-player gameplay on the same device
- 🐞🐝 Cute critter characters (Ladybug and Bumblebee emojis)
- 🔄 Random symbol assignment each game
- 📊 Comprehensive score tracking (wins, losses, draws)
- 🎨 Modern, responsive design
- 📱 Mobile-friendly interface
- 🔁 Continue or reset options
- HTML5 - Structure and semantics
- CSS3 - Styling and responsive design
- Vanilla JavaScript - Game logic and interactivity
- A modern web browser (Chrome, Firefox, Safari, Edge)
- Basic understanding of HTML/CSS/JavaScript (for contributors)
-
Download the repository as ZIP or clone it:
git clone https://github.com/curiousbud/Tic-Tac-Toe-game-with-HTML-CSS-and-JavaScript.git
-
Navigate to the project folder:
cd Tic-Tac-Toe-game-with-HTML-CSS-and-JavaScript
-
Open
index.html
in your web browser
If you have VS Code with Live Server extension:
- Open the project folder in VS Code
- Right-click on
index.html
- Select "Open with Live Server"
- The game randomly assigns 🐞 (Ladybug) and 🐝 (Bumblebee) to Player 1 and Player 2
- Players take turns clicking empty squares
- Get three symbols in a row (horizontal, vertical, or diagonal) to win
- Scores are tracked across multiple games
- Use Continue to play again with the same scores, or Play Again to reset everything
Tic-Tac-Toe-game/
├── index.html # Main HTML file
├── assets/
│ ├── css/
│ │ └── style.css # Styling
│ └── js/
│ └── app.js # Game logic
├── README.md
└── LICENSE
We love contributions! Here's how you can help improve this project:
- Check if it's already reported in Issues
- If not, create a new issue with:
- Clear description of the bug
- Steps to reproduce
- Expected vs actual behavior
- Screenshots if applicable
Great! We'd love to hear it. Please:
- Open an issue to discuss your idea first
- Wait for feedback before starting work
- Fork the repository
- Create a new branch:
git checkout -b feature/your-feature-name
- Make your changes
- Test thoroughly
- Commit with a clear message:
git commit -m "Add: description of your changes"
- Push to your fork:
git push origin feature/your-feature-name
- Open a Pull Request
This project is licensed under the MIT License - see the LICENSE file for details.
- 🐛 Bug Reports: GitHub Issues
- 💬 Questions: Open a discussion or issue
- 📧 Contact: Your GitHub Profile