Response Time Test

Inspect visible ghosting, overshoot, and motion clarity with browser-rendered moving patterns.

Go to test controls

This check opens a focused test surface. You can return with Escape. Review what this browser test can and cannot measure.

Before you start

  • Confirm the intended refresh rate, display mode, and overdrive setting.
  • Use 100% browser zoom. The page uses a fixed dark background; hold pattern and speed fixed while changing one display setting.
Step-by-step instructions

How to run this check

  1. Start the Response Time Test
  2. Start with Moving Squares, or choose Moving Dot, Flashing Square, or Moving Emoji
  3. Adjust the speed and follow the moving object with your eyes
  4. Note visible blur, dark trails, or bright overshoot halos
  5. Save the observed edge appearance and setup; compare one overdrive setting at the same speed, pattern, and fixed dark background

Inspect motion clarity in fullscreen; this pattern does not calculate milliseconds.

What this page draws

Start with Moving Squares: its flat colors and straight edges give you a consistent reference. All patterns share a dark background with CSS color oklch(21% 0.034 264.665). Keep the browser zoom, display scaling, refresh rate, and viewing position fixed when comparing one overdrive setting.

Moving Squares · the default
Four squares, each 3rem wide and tall: white #ffffff, red #ff0000, green #00ff00, and blue #0000ff. Each travels at the speed setting × 60 CSS pixels/second: setting 5 requests 300 CSS px/s.
Moving Dot
One 2rem circle with CSS color oklch(63.7% 0.237 25.331), moving at the same base speed. Follow it with your eyes; the page does not check camera tracking or exposure.
Flashing Square
One stationary 4rem white square (#ffffff). Its animation requests alternating visibility every 100 ms, or five complete cycles per second. The speed control does not change this interval. This is browser-generated flashing, not a measurement of the display's backlight. Skip it if flashing is uncomfortable.
Moving Emoji
Three emoji rows request 1×, 2×, and 3× the base speed. Each uses a 4rem × 2rem box and 2.25rem font size. The glyph and its colors depend on the device's emoji font, so use the squares for comparisons between devices.

At a 16px root font size, 3rem, 2rem, and 4rem are 48, 32, and 64 CSS pixels respectively. Browser zoom, scaling, and device pixel ratio determine their physical size; these are not panel-pixel dimensions.

The animation updates at browser frame callbacks, using elapsed time to place the next frame. At 300 CSS px/s, evenly spaced 60 fps callbacks advance about 5 CSS pixels each; 120 fps callbacks advance about 2.5. Delayed callbacks can make larger jumps, and the requested flashing interval can be sampled unevenly. These calculations describe the source animation, not measured refresh rate or pixel response. See MDN's animation timing reference.

👁️ What You're Looking For

Clean Motion Example

Sharp Edge

Reference illustration: a distinct edge with no obvious repeated copy.

Blurred edge or smear

Blurred Trail

Record the speed and settings when the edge appears wider or smeared.

Dark trail or repeated copy

Ghost Trail

Record whether a darker or repeated shape follows the moving object.

Bright or colored halo

Bright Halo

A light or colored rim can be compared across supported overdrive modes.

Controlled comparisons

Change one row at a time and record the same object, speed, background, viewing method, and browser window. This page does not produce a panel response-time value in milliseconds.

This page keeps one dark gray background. Moving Squares compares white, red, green, and blue objects against that background; it has no light-background mode. A result here does not cover every light-to-dark or dark-to-light transition in your usual content.

Change Keep fixed Record
Overdrive mode Refresh rate, pattern, speed, background Dark trail, bright halo, or no obvious change
Refresh rate Overdrive mode, pattern, speed, background How the same edge and trail change
Motion speed Refresh rate, overdrive mode, pattern colors First speed where a trail or halo is obvious

Use the edge appearance to choose a comparison

No distracting trail or halo noted at the speed I checked.
Try the same refresh and overdrive settings in the game or scrolling content that matters to you. Keep this browser run as a comparison baseline.
A moving edge looked blurred or smeared.
Repeat with the same mode and speed while following the moving object with your eyes. Confirm the intended OS refresh rate and compare one overdrive setting at a time.
A dark trail or repeated copy followed the object.
Keep the pattern, speed, and refresh rate fixed. Compare adjacent overdrive settings and check whether a shorter dark trail comes with a new bright halo.
A bright or colored halo followed the object.
Try one lower overdrive setting at the same refresh rate and pattern speed, then restore the original setting to check whether the halo returns.
Both a trail and a bright halo were visible.
Note the object color and background separately. Compare one overdrive setting, then recheck your usual content at the refresh rates you actually use.
Motion appearance was not assessed / I am not sure.
Start with Moving Squares at a comfortable speed. Follow one object and describe its trailing edge; leave the result uncertain if you cannot repeat the observation.

What this browser test can tell you

Can help you check

  • Visible ghosting, overshoot, and motion clarity with moving patterns.

Cannot measure

  • This test cannot produce a panel response-time value in milliseconds.

Interpret this observation

  • Record the mode, object, speed, and visible trail or halo. This page uses a fixed dark background, so it does not compare every light-to-dark and dark-to-light transition.
  • Browser frame cadence, operating-system compositing, refresh rate, scaling, and display overdrive settings can all change the visible motion.
  • Exact pixel transition timing requires a photodiode and oscilloscope or equivalent lab equipment.
Setup and sources

Recommended setup

  1. Let the display warm up and use its normal gaming or motion setting.
  2. Keep the browser visible and compare several motion speeds.

Sources

Methodology reviewed: