Online Breakout Game

Score

Best

Lives

Level

Streak

x{{ streak }}

Time

State

{{ bricksCleared }} bricks cleared • {{ bricksRemaining }} left

Graphics unavailable. Try another browser or device.

Breakout

Choose a preset, then clear the wall without dropping the ball.

Ball speed:

Use a slower pace for practice or a faster pace for tighter reaction work.

{{ Number(customBallSpeed).toFixed(2) }}x opening pace

Paddle width:

Wider paddles make recovery safer; narrower paddles make edge control matter more.

{{ Number(customPaddleWidth).toFixed(2) }} field units

Opening rows:

Choose fewer rows for short practice rounds or more rows for longer clears.

Pointer-drag the playfield for direct paddle control, then use paddle edges to sweep columns and stack streak multipliers.

Controls

← →

move paddle

Mouse Touch

direct paddle aim

Space P

pause & resume

fullscreen

Paused

Press Space or P to continue

Game Over

Run Summary

Wall cleared or rally ended. Review the run, then drop back in.

Final Score {{ score }}

Score{{ score }}
Best{{ bestScore }}
Level reached{{ level }}
Time{{ runClock }}
Clears{{ bricksCleared }}
Max streakx{{ longestStreak }}

Mouse Trail Guide Auto

Metric	Value	Copy
{{ row.label }}	{{ row.value }}

Time	Event	Value	Detail	Copy
{{ row.time }}	{{ row.event }}	{{ row.value }}	{{ row.detail }}

Embed:

Customize

Include current inputs

Size

Advanced

Width

Height

Aspect ratio

Max height

Collapsible embed

Allow fullscreen

Referrer policy

Sandbox tokens

Breakout-style play is a compact test of aim, timing, and recovery. A paddle protects the lower edge of the playfield, a ball rebounds around the walls, and a brick wall disappears one contact at a time. The game looks simple because every object has an obvious job, but a strong run depends on where the ball returns after each hit.

The useful skill is control over the next angle. A center paddle hit sends the ball upward on a more vertical route and gives more time to reset. An edge hit adds sideways movement and can sweep through columns faster, but the same angle can become hard to save if the ball returns low. That is why two runs with the same score can feel very different.

Breakout-style playfield showing a paddle, ball paths from center and edge hits, a brick wall, and score confidence cues.

A fair score comparison starts with the same challenge. More lives, a wider paddle, a slower ball, or fewer starting rows make survival easier. A harder setup can show better control even when the raw score is lower because the player has less time and less paddle width to correct mistakes.

The game is entertainment and practice. A best score is useful as a personal marker in the same browser, but it is not a public ranking, prize result, or cash-equivalent value. The playfield also depends on browser graphics support, so a graphics warning usually means the device or browser could not start the interactive stage.

How to Use This Tool:

Choose the challenge setup first, then keep the same setup when you want a fair comparison between runs.

Start with Easy, Normal, or Hard. Easy gives 4 lives and a wider paddle, Normal is the default benchmark, and Hard starts faster with a narrower paddle and more rows.
Use Custom when you want to set Ball speed, Paddle width, and Opening rows. Custom speed ranges from 0.60x to 1.80x, paddle width from 1.0 to 2.4, and rows from 3 to 9.
Set Mouse, Trail, Guide, and Auto before the rally matters. Changing visibility or serve behavior is allowed during play, but fixed settings make later comparisons cleaner.
Move with the arrow keys, pointer aiming, or touch arrows. Press Space to serve a held ball; after launch, Space and P pause or resume.
Aim center hits when recovery matters and edge hits when you want a wider sweep across the wall. Watch Streak because quick brick hits inside the streak window multiply brick score.
If the stage says graphics are unavailable, reload once and then try a current browser or device with working WebGL support. The run cannot start properly until the playfield appears.
At game over, review Run Summary, Brick Ledger, and JSON. Use the summary for comparison, the ledger for hit and miss timing, and exports only after the run record looks complete.

Interpreting Results:

Score is the headline, but it is built from both brick count and streak timing. A run with fewer bricks can score surprisingly well if several hits arrive close together. A run with many bricks but short streaks can look steadier in play while scoring less sharply.

Breakout result fields and interpretation checks.
Result field	What it means	Check before comparing
`Score`	Total points from brick hits after streak multipliers.	Compare only against the same preset or identical custom values.
`Overall best score`	The highest score saved in this browser profile.	It is local to the browser and not a shared ranking.
`Preset best score`	The highest score saved for the selected preset or custom setup label.	Use it when changing presets would make the overall best misleading.
`Level reached`	The current wall number reached during the run.	A new level means a prior wall was cleared even if current progress is low.
`Current wall progress`	Bricks removed from the active wall, shown against the active wall total.	It resets after a full clear because the next wall is built immediately.
`Longest streak`	Highest quick-hit chain inside the 3.5-second streak window.	A high value with weak progress may be one burst rather than broad control.
`Run duration`	Elapsed active time shown as minutes and seconds.	Pause stops active play, so use duration as rally time rather than wall-clock time.

The false-confidence case is a personal best earned with more forgiving settings. Treat it as a valid run, but verify it by replaying the same setup and checking supporting fields such as Level reached, Current wall progress, Run bricks cleared, and Longest streak.

Technical Details:

Breakout movement is governed by rectangular bounds and collision response. The ball reverses horizontal direction at the side walls, reverses vertical direction at the top wall, and costs a life when it passes the bottom boundary. Brick contact removes one brick and bounces the ball on the axis that best matches the overlap at impact.

Paddle contact is the main source of player control. The ball turns upward after touching the paddle, and the hit position adjusts sideways velocity. Center contact keeps the route easier to read. Off-center contact adds capped horizontal speed so edge shots are useful without making the ball unrecoverable.

Progression comes from pressure rather than hidden score bands. A brick is worth 10 points multiplied by the current streak. The streak grows only when the next brick falls within 3.5 seconds of the previous brick. Clearing every brick advances the level, rebuilds the wall with one extra row, and raises the base upward speed until it reaches the cap.

Formula Core

The main equations describe brick scoring, level row growth, speed increase after a wall clear, and paddle-edge deflection.

\begin{array}{lcl} g_{brick} & = & 10 \times s \\ rows (level) & = & baseRows + (level - 1) \\ v_{y,next} & = & clamp (| v_{y,current} | + 0.004, 0.015, 0.085) \\ v_{x,next} & = & clamp (v_{x,current} + 0.012 \times o, - 0.06, 0.06) \end{array}

Breakout formula terms and gameplay meanings.
Term	Meaning	Value or range	Effect on play
`s`	Current streak multiplier.	1 and up	Increases the 10-point brick value when hits stay inside the streak window.
`baseRows`	Opening brick-row count.	3 to 9	Sets the height of level 1 before later levels add rows.
`vy`	Base vertical ball speed.	0.015 to 0.085	Rises after each wall clear, shortening return time.
`o`	Normalized paddle hit offset.	-1 to 1	Center hits stay vertical; edge hits add sideways speed.

Setup Values

Breakout setup values by preset.
Setup	Lives	Paddle width	Opening rows	Opening ball velocity
Easy	4	2.1	6	x `0.015` and y `0.022` for a slower first wall.
Normal	3	1.6	6	x `0.020` and y `0.030` for the default benchmark.
Hard	3	1.25	7	x `0.028` and y `0.038` for a faster first rally.
Custom	3	1.0 to 2.4	3 to 9	Normal velocity multiplied by `0.60` to `1.80`.

Rule Core

Breakout collision and scoring rules.
Event	Rule	Result to watch
Side wall	Horizontal velocity reverses while vertical velocity continues.	The rally stays alive without changing score or streak.
Top wall	Vertical velocity turns downward after contact with the upper boundary.	The ball returns toward the paddle after crossing the brick area.
Paddle	Vertical velocity turns upward, and off-center contact adds capped horizontal speed.	Center contact favors recovery; edge contact favors column sweeping.
Brick	One brick disappears, the ball bounces on the impact axis, and score rises by `10 x streak`.	Fast repeated hits raise the multiplier.
Bottom miss	One life is removed, streak resets, and the ball returns to the paddle if lives remain.	With `Auto` on, the next serve begins quickly; with it off, the ball waits.
Wall clear	Level increases by 1, streak resets, the wall is rebuilt with one more row, and vertical speed rises.	Current wall progress restarts on the new wall.

Limitations and Browser Notes:

The score is a local practice marker. It has no monetary value, does not represent an official leaderboard, and should be compared only within the same browser and setup.

The playfield requires WebGL-capable browser graphics. If graphics are unavailable, the interactive stage cannot start correctly.
Overall best score, Preset best score, and recent run history are stored in the current browser profile and can disappear when site data is cleared.
Sound depends on browser audio rules and may require a click or key press before tones play.
Pointer control, keyboard control, and touch control can feel different, so keep the control method stable when comparing runs.

Worked Examples:

A controlled Normal baseline

A Normal run that ends with Score 740, Level reached 1, Current wall progress 46 / 60 (77%), and Longest streak x4 shows solid first-wall control. The score is helped by quick hits, but the progress field matters because most of the opening wall was actually removed.

A Hard run that scores lower but asks more

A Hard run with Score 620, Level reached 1, Current wall progress 33 / 70 (47%), and Longest streak x5 may be stronger than an Easy run with a slightly higher score. Hard starts with seven rows, a 1.25-wide paddle, and faster velocity, so the same score range comes from tighter conditions.

A level clear with reset wall progress

After clearing the first Normal wall, a later summary might show Score 1120, Level reached 2, and Current wall progress 18 / 70 (26%). That does not mean only 18 bricks were cleared during the whole run. It means level 1 was cleared, level 2 now has 70 bricks, and 18 of the new wall are gone.

Graphics failure before play starts

If the control shell appears but the playfield reports graphics unavailable, the score fields are not the problem. The browser did not provide usable WebGL graphics support. Reload once, then switch browser or device if the stage still does not render.

FAQ:

Does the game save run history?

Yes. It stores overall best score, preset best scores, and a small recent-run list in the current browser profile. CSV, DOCX, and JSON exports are better when you need a durable record outside the browser.

Why is the ball waiting on the paddle?

The ball is in a held serve state. This happens when Auto is off or after some reset and life-loss states. Press Space, use the touch Serve button, or pointer-click the playfield to launch.

Can I play without the mouse?

Yes. Turn Mouse off and use the left and right arrow keys, or use the touch arrows on smaller screens. Space and P handle pause and resume during keyboard play.

Why did my score improve but my run felt worse?

A high Score can come from one hot streak or an easier setup. Check Level reached, Current wall progress, Run bricks cleared, and Longest streak before calling it an improvement.

Does Trail make the game easier?

Trail makes motion easier to see by drawing particles, but it does not change brick value, ball speed, paddle width, collision rules, or level progression.

Does the score have prize or cash value?

No. Score, Overall best score, and Preset best score are entertainment and practice markers for this page, not wagering outcomes, cash-equivalent values, or official leaderboard records.

Glossary:

Breakout-style play: A brick-breaking game pattern where a paddle keeps a ball in play while the ball removes a wall of bricks.
Serve: The launch of a held ball from the paddle into the active playfield.
Streak window: The 3.5-second period in which another brick hit increases the streak multiplier.
Current wall progress: The active wall's removed-brick count and percentage since that wall was built.
Preset best score: The highest locally stored score for the selected preset or custom setup label.
WebGL: The browser graphics feature needed to render the interactive playfield.

References:

Breakout, Atari.
WebGL: 2D and 3D Graphics for the Web, MDN Web Docs, July 15, 2025.
WebGL: 3D Graphics for the Web, Khronos Group.