Tic Tac Toe Deluxe

A modern, feature-rich Tic Tac Toe game built with HTML, CSS, and JavaScript. This responsive web application offers a personalized gaming experience with multiple customization options and advanced gameplay features.

🎮 Features

• Multiple Game Modes: Play against another person (PvP) or challenge the computer (PvC)
• Adjustable Difficulty Levels: Easy, Medium, and Hard AI opponents
• Variable Board Sizes: Choose between 3×3, 4×4, and 5×5 grids
• Score Tracking: Keep track of wins for each player
• Win Streak Bonuses: Visual effects and special sounds for consecutive wins
• Game History: Review past games with timestamps and results

Personalization

• Custom Player Names: Personalize the experience with your own player names
• Custom Markers: Choose from various emoji markers instead of traditional X and O
• Multiple Themes: Select from 6 different color themes (Default, Dark, Neon, Pastel, Retro, Ocean)
• Sound Effects: Toggle sound effects on/off and adjust volume
• Auto-Restart: Option to automatically start a new game after completion

User Experience

• Responsive Design: Optimized for all devices from desktops to mobile phones
• Touch Support: Enhanced touch controls for mobile devices
• Landscape Mode: Special layout for landscape orientation on mobile
• Visual Feedback: Animations and highlights for game events
• Accessibility: Clear visual indicators and status messages

🎯 How to Play

1. Open the Game: Open tic-tac-toe.html in any modern web browser
2. Choose Game Mode: Select Player vs Player or Player vs Computer
3. Make Your Move: Click on any empty cell to place your marker
4. Win the Game: Get three (or more, depending on board size) of your markers in a row (horizontally, vertically, or diagonally)
5. Track Scores: Your wins are automatically tracked at the top of the screen
6. Review History: Scroll down to see your game history

🎨 Customization

1. Click the user icon (👤) in the top right corner to open the personalization modal
2. Navigate through the tabs to customize different aspects of the game:
   • Players: Set custom names for both players
   • Markers: Choose from various emoji options instead of X and O
   • Themes: Select your preferred color theme
   • Board: Change the board size (3×3, 4×4, or 5×5)
3. Click "Save Changes" to apply your personalization choices

Game Options

• Game Mode: Switch between Player vs Player and Player vs Computer
• Difficulty: When playing against the computer, select Easy, Medium, or Hard
• Auto-Restart: Toggle automatic game restart after a win or draw
• Sound: Toggle game sounds on/off and adjust volume
• Theme: Quick toggle between light and dark themes

💻 Technical Details

• Languages: HTML5, CSS3, and vanilla JavaScript
• Responsive Design: CSS Grid and Flexbox for layout
• AI Algorithm: Minimax algorithm for computer opponent
• Data Storage: Local storage for saving settings and game history
• Compatibility: Works on all modern browsers and devices

🚀 Future Enhancements

• Online multiplayer mode
• Additional board sizes and game variations
• User accounts and global leaderboards
• More customization options and themes
• Achievements and challenges system

🔧 Installation

No installation required! Simply download the files and open tic-tac-toe.html in your web browser.

git clone https://github.com/yourusername/tic-tac-toe-deluxe.git
cd tic-tac-toe-deluxe

Then open tic-tac-toe.html in your browser.

📝 License

This project is open source and available under the MIT License.

🙏 Credits

• Developed by AYOKANMI ADEJOLA
• Icons from Font Awesome
• Inspired by classic Tic Tac Toe games