Match
{{ statusLabel }}
Difficulty
{{ difficultyLabel }}
Opponent
{{ opponentLabel }}
Play As
{{ playAs }}
Move History
{{ movesPlayed }}
Streak
{{ streakLabel }}
Win Rate
{{ winRateLabel }}
{{ streakProgressCopy }}
{{ streakFlash }}

Tic Tac Toe

Set the match, then test your responses against the board.

Hold win streaks to climb the leaderboard, or practice specific openings to sharpen your responses.
Controls
Mouse
place mark
U
undo move
R
reset board
H
cycle hint

Match Recap

{{ gameOverMessage }}
  • Result{{ lastOutcomeLabel }}
  • Moves{{ movesPlayed }}
  • Streak{{ streakLabel }}
  • Win Rate{{ winRateLabel }}
{{ summaryHeading }}
{{ difficultyLabel }}
{{ summaryFigure }}
{{ summaryCopy }}
{{ opponentLabel }} Play as {{ playAs }} {{ scoreboard.total }} Matches Streak {{ scoreboard.streak }}
Board Intelligence
Best move {{ bestHintCellLabel }}
{{ cellName((row - 1) * 3 + (col - 1)) }}
{{ intelScoreLabel((row - 1) * 3 + (col - 1)) }}
Board intelligence appears once a match or move sequence exists.
Match Configuration
Live edits synced
{{ row.label }} {{ row.value }}
# Player Cell Copy
{{ i + 1 }} {{ m.mark }} {{ cellName(m.index) }}
No moves yet — start a match to populate the log.

        
:

Introduction:

Tic tac toe is a compact three by three alignment game where every move changes the whole board. Because the standard game is fully solved, the real skill is not memorizing a huge ruleset but learning how openings, blocks, and forks shape the result. This tool turns that small game into a focused practice space with instant feedback, review surfaces, and adjustable computer strength.

It works for two common situations. One is casual play when you want a clean board, a fast rematch, and the option to hand the same device to another person. The other is deliberate practice when you want to test an opening as X, defend as O, or study why one empty square is safe while another loses the board.

The package also keeps the position legible while you play. Each occupied square shows its move number, the result banner updates as soon as a line forms, and the follow-up tabs let you inspect match stats, the move list, and a JSON state snapshot. That combination makes the game useful as a replay tool, not just a quick diversion.

A realistic use case is short tactical rehearsal. You might open from the center in one round, switch to a corner in the next, then compare how often the computer forces a draw or punishes an unblocked threat. If you are teaching someone the basics, the same board also works in hot-seat mode without turning the session into a networked match setup.

The important caution is that a single result says very little on its own. On a solved board, one missed block can flip the whole outcome, and even strong play often ends in a draw. The value here is in repeating positions, reviewing the move sequence, and noticing which choices consistently create or remove forced replies.

Everyday Use & Decision Guide

Start by choosing what kind of session you want. If you want light play or you are showing the game to someone new, use the casual computer or switch to two-player mode. If you want training value, keep the computer enabled and choose whether you want to move first as X or practice replies as O.

The three difficulty levels are meaningfully different rather than cosmetic. Casual play will sometimes block an immediate threat, but it can also drift into random legal moves. Balanced play always takes obvious wins and blocks, then usually prefers strong continuations while still allowing some variety. Perfect play evaluates the remaining tree and chooses from the best available moves, so it will not miss a forced draw or a forced win.

Difficulty modes and what they mean in practice.
Mode What the computer does Best use
Casual Looks for immediate wins, may block simple threats, then often chooses a random legal square. Warm-up games, relaxed play, introducing the rules.
Balanced Takes immediate wins and blocks, usually follows strong continuations, and still leaves some variation between equal-looking turns. Everyday practice without making every round feel identical.
Perfect Chooses from minimax-best moves, preventing avoidable losses and preserving forced draws when a win is unavailable. Studying correct replies, testing openings, and checking whether a position is already lost.

Hints and threat highlights make the board more readable while you are still playing, not only after the fact. Empty cells can be labeled as winning, drawing, or risky continuations for the side to move, and separate threat markers point at squares that must be respected because the opponent already has two marks in a line. Use them as study aids when you want to understand the position, then turn them off when you want a cleaner competitive board.

The summary and streak surfaces are best treated as practice telemetry. Win rate, current streak, best streak, and match totals help you notice patterns across many rounds, especially if you keep the difficulty fixed. They are less useful as bragging metrics than as a record of whether you are learning to avoid the same mistakes in the same kinds of positions.

Technical Details

Under the surface, the game state is a nine-cell array containing X, O, or an empty value. After every move, the engine checks the eight legal winning lines: three rows, three columns, and two diagonals. If any line contains the same non-empty mark in all three positions, that mark wins. If all cells are filled and no line exists, the round is scored as a draw.

The computer opponent mixes direct tactics with full position search. Before anything deeper, it looks for an immediate winning move and an immediate blocking move. Past that point, the analysis routine evaluates candidate moves with a minimax search that scores terminal positions as win, draw, or loss from the active side's point of view. The hint labels and the board-intelligence grid reuse that same evaluation, which is why they describe position quality rather than vague difficulty.

Difficulty changes how strictly the search result is followed. Casual mode may ignore a block and choose a random empty square. Balanced mode always respects immediate tactics, usually follows best moves, and still introduces some variety when several continuations look acceptable. Perfect mode stays on the best-scoring branch, although equivalent best moves can still rotate because the package picks randomly among equally optimal squares.

The review and export surfaces are broader than the board itself. The stats tab exposes totals, wins, losses, draws, streak data, side, opponent type, and current status, with copy, CSV download, DOCX export, and PDF export. The moves tab records the played sequence as numbered rows and supports CSV copy or download. The JSON tab packages parameters, board state, winner or draw state, move history, analysis scores, threat cells, and scoreboard values for copy or file download.

There is also a compact position string in the query-backed state. Each cell is encoded as X, O, or - for empty, which lets the board restore a specific position if the string has exactly nine valid characters. That is useful for replaying a board state, but it should be read as a position snapshot rather than a faithful record of move order.

Score persistence is local to the device. The package stores total matches, wins, losses, draws, current streak, and best streak in browser storage so they survive page reloads. Match play itself is local as well: there is no server-side opponent, no account sync, and no remote game lobby. Copy and download actions happen only when you trigger them.

The rendered board also has an optional visual layer. When the browser can create a WebGL context, the page draws a decorative animated board backdrop behind the interactive grid. If that support is unavailable, the game logic still works and the plain clickable board remains the functional surface.

Step-by-Step Guide

  1. Choose the opponent type, your mark, and the difficulty before the first move. If you pick O against the computer, the tool can let the computer open as X.
  2. Start the match and place a mark on any empty square. The turn banner, move numbers, and summary panel update immediately.
  3. If you are studying the position, leave hints or threat highlights enabled and use the board-intelligence section to compare empty cells before you commit.
  4. Use undo when you want to back up and test a different idea. Against the computer, undo rolls back enough state to restore a playable decision point rather than leaving the board half a reply out of sync.
  5. After the round ends, review the stats tab for the match context, the moves tab for sequence review, and the JSON tab if you want a structured snapshot for later reference.
  6. Reset for another round when you want to keep the same session settings, or return to the main menu when you want to change the match setup more deliberately.

Interpreting Results

The most useful result is not simply who won. It is whether the board ever offered a square that would have preserved a draw or created a forced win. If the hint labels mark one empty cell as a win path and several others as risk, the lesson is about move selection under optimal reply, not about luck or timing.

Match statistics are best read over a cluster of rounds. A single loss in perfect mode usually means one tactical miss. A rising draw count against perfect mode can be a sign that your defense and blocking discipline are improving. A long streak against casual mode may say more about the opponent profile than about how well the same openings would survive against balanced or perfect play.

The move list and JSON snapshot are particularly helpful when a result feels surprising. They let you compare the visible finish with the exact position history and supporting analysis values. If a board looked harmless and then collapsed in one move, the threat markers and the move record usually show that the decisive mistake happened earlier than the winning line itself.

Worked Examples

Practicing defense as O. Set the opponent to computer, choose O, and use perfect mode. The computer opens first, which is useful if you want to rehearse replies instead of openings. After each move, compare the hinted cells. If only one empty square still shows a draw path, that square is the defensive requirement for keeping the game level.

Testing a risky opening line. Start as X in balanced mode and play a corner opening. If the round later ends in a loss, open the moves tab and note where the sequence stopped forcing a draw. Then replay the same setup and use undo after the key branch point to test whether a different second or third move would have preserved a safer position.

Using hot-seat review. In two-player mode, the same board becomes a clean replay surface for classroom or family play. Because each occupied square keeps its move number, you can finish a round, scroll to the move list, and ask which earlier square created the winning diagonal or why a block was mandatory one turn sooner.

FAQ

Can I use it for two people on one device?

Yes. Switching the opponent to the second-human mode disables computer replies and turns the board into a hot-seat match where players alternate on the same screen.

Will perfect mode always beat me?

Not necessarily. On the standard board, optimal play leads to a draw. Perfect mode prevents avoidable mistakes and converts clear errors, but it does not change the mathematics of the game.

What is stored between visits?

The persistent record is the scoreboard: totals, wins, losses, draws, current streak, and best streak. Ongoing match state is not silently synced to a remote account, although you can copy or download state yourself if you want to keep it.

Can I share a position with someone else?

You can share the structured JSON snapshot or the compact board-state string, both of which recreate the visible position well. The compact string is best for restoring occupancy, not for proving the exact chronological order in which the marks were played.

Glossary

Draw
A finished board with no three-in-a-row line for either side.
Threat cell
An empty square that would complete the opponent's line on the next move if it is not addressed.
Minimax
A search method that assumes each side chooses moves that help itself and hurt the opponent, producing win, draw, or loss scores for candidate turns.
Solved game
A game whose outcome can be determined in advance with perfect play. For standard tic tac toe, that outcome is a draw.
Streak
The current run of player wins stored in the local scoreboard.