Rock Paper Scissors Game

(Light/Dark Mode Enabled)

Developed Using:

HTML5

CSS3

JavaScript (ES6)

Project Description:

This is a Rock Paper Scissors game built with basic web technologies. It allows the user to play against the computer using intuitive graphical buttons. The game keeps track of scores, displays results dynamically, and offers a light/dark mode toggle for improved user experience.

Features Implemented:

Interactive Game UI with three clickable options: Rock, Paper, and Scissors.

Computer Choice Generation using random number generation.

Score Tracking System for both user and computer.

Dynamic Message Box that updates after every round (Win, Lose, Draw).

Dark/Light Mode Toggle button to switch UI themes.

Responsive Layout using Flexbox for proper alignment and spacing.

How It Works:

User clicks on one of the choices (Rock, Paper, or Scissors).

Computer randomly selects its move.

The game logic compares both selections:

Rock beats Scissors

Paper beats Rock

Scissors beats Paper

Based on the result:

Score is updated.

Message is displayed showing who won the round.

Draw situations are handled separately with unique styling.

Light/Dark mode toggles the color scheme of the page for accessibility and comfort.

Styling Details:

Clean, centered layout with Flexbox.

Vibrant feedback using background colors (green for win, red for loss, purple for draw).

Circular image buttons with hover and active effects.

Theme switch implemented via toggling CSS classes (light and dark).