The world went crazy for Wordle. Building it teaches incredible 2D array matrix logic and keyboard event handling.

Checking the Guess

let secretWord = "APPLE";
let currentGuess = "";

function checkGuess() {
  for (let i = 0; i < 5; i++) {
    const letter = currentGuess[i];
    if (letter === secretWord[i]) {
      // Green
      tiles[i].style.backgroundColor = "#538d4e";
    } else if (secretWord.includes(letter)) {
      // Yellow
      tiles[i].style.backgroundColor = "#b59f3b";
    } else {
      // Gray
      tiles[i].style.backgroundColor = "#3a3a3c";
    }
  }
}

Try guessing the word in the Live Demo to see the real CSS transitions and letter flipping animations!