How do I make a reaction time test with AI and share it as a link?

Quick answer

Ask ChatGPT or Claude for one HTML file that waits a random 1 to 4 seconds, changes the screen's color, and times your tap in milliseconds. Upload the file to a free host and send the link; players need no account. Each player's best time stays in their own browser.

Publish my test for free

Free plan: no credit card, 1 published page.

On this page

You've tried a reaction time test online and want your own: your colors, your rules, and a link you can drop in a group chat to see who's fastest. An AI writes one in a single reply. This guide gives you the instructions to paste into ChatGPT or Claude, the 3 checks to run on your phone, and the steps to publish it as a link. It also says plainly where scores are kept, because that decides whether you can have a leaderboard.

Already have the HTML file? The upload box at the top of this page makes a preview link without an account. That preview runs no scripts, so the test won't start there. Click Keep this page — free, no card and sign up, and the page moves into your account, where the test runs.

How a reaction time test works

Every reaction test follows the same loop:

  1. The player presses Start.
  2. The page waits a random time, such as 1 to 4 seconds. A random wait stops players from tapping on rhythm.
  3. The screen changes color, and the page notes the exact moment.
  4. The player taps. The page subtracts the two moments and shows the result in milliseconds.
  5. A tap before the change counts as a false start. The page shows "Too soon!" and repeats the round.

One round is noisy, so most tests run 5 rounds and show the average and the fastest.

The timer matters. performance.now() returns milliseconds as a decimal number, and MDN says browsers coarsen it to 100 microseconds on an ordinary page. That's far finer than a human tap. Ask the AI to use it rather than Date.now(), which counts whole milliseconds.

Your score also includes the time your screen and touchscreen take. The same person can score differently on a laptop and a phone, so compare scores made on the same kind of device.

The instructions to give ChatGPT or Claude

Paste this into ChatGPT, Claude, or Gemini. Change the colors, the words, or the number of rounds before you send it.

Make a reaction time test as one HTML file, with the CSS and JavaScript inside.

- A "Start" button. After it, wait a random 1 to 4 seconds, then turn the whole screen green and show "Tap!".
- Time the tap with performance.now(), from the moment the screen turns green to the pointerdown event. The space bar works too.
- A tap before the screen turns green shows "Too soon!" and repeats that round.
- Run 5 rounds. Then show each round, the average, and the fastest round in whole milliseconds.
- Save the best average in localStorage and show it as "Your best".
- A "Play again" button, and a "Copy my score" button that copies a line like "My average: 243 ms" with the page's address.
- On a phone held upright, the whole screen is the tap area. Use touch-action: manipulation, and make the buttons at least 44px tall.
- Don't send anything anywhere, and don't use image files.

Two lines do most of the work. pointerdown fires the moment a finger touches the screen, before the finger lifts. touch-action: manipulation turns off double-tap to zoom, and MDN notes that this removes the browser's delay before a tap counts as a click.

Convika's reaction time test template has a longer version of these instructions, with share buttons for X and LINE that post the player's average. You can copy it from there, or let Convika's AI make the page: it uses 1 AI credit, and a new account starts with 10.

Try it on your phone before you share it

Most people will open your link on a phone. Before you send it, play 3 rounds on yours and check:

  • A tap anywhere counts. If only a small box reacts, ask the AI: "Make the whole screen the tap area."
  • Quick taps don't zoom the page. If the page jumps or zooms, ask: "Add touch-action: manipulation to the body."
  • An early tap is caught. Tap before the color changes. You should see "Too soon!", not a score of 0 ms.

On Convika's Free plan, a 40 px Convika bar sits along the bottom of the screen. If the Start button is at the very bottom, ask the AI to keep it clear of the bottom 40 px.

Publish your reaction test in 4 steps

1. Save the test as one HTML file

If the AI gave you a file, download it. If the code is in the chat, copy all of it from the first <!DOCTYPE html> to the last </html>. The file can be up to 2 MB.

2. Make a free Convika account

Sign up at app.convika.com. The Free plan needs no credit card. If you sign up from a button on this page, the upload screen opens when you finish.

3. Upload it and play it in the preview

Drop the file on Upload a file, or paste the code on Paste code, then click Create my preview. When Your preview is ready appears, click Open preview. The preview runs the test's scripts the way the published page will, and nobody else can see it yet. Open the same preview on your phone too.

Click Publish. The first time you publish, Convika asks you to Choose how to publish your page. Free is enough for a reaction test. The other two options are the 1-year Pro pass ($29 once) and Pro monthly, which remove the Convika bar. Your test goes live at an address like yourpage.convika.page.

On Free, the test is published as Public: anyone with the link can play, and the page may show up in search results and in Convika's gallery. To keep it out of both, choose Private link (Pro or pass) in the confirmation when you publish. Anyone with a private link can still play it.

Paste the link in a group chat, a Discord server, or your stream's description. Players open it in their browser and play, with no account and no app. To show it on a screen in a room, How to turn an HTML file into a QR code covers the code people scan.

Where the best time is saved

The best time is saved in localStorage, in the player's own browser. It stays there after the tab closes, so a player who comes back sees "Your best" again. It is never sent to you or to other players.

Three things wipe it or hide it:

  • Another browser or device. A score saved in Safari on a phone doesn't appear in Chrome on a laptop.
  • A private window. MDN says localStorage from a private window is cleared when the last private tab closes.
  • A new address. Saved data belongs to the page's address. If you later move the test to your own domain, scores saved at the old address don't come along. Pick the address before you share the link widely.

Sharing a score

The quickest way is a screenshot of the result screen. The "Copy my score" button in the instructions above copies a line with the average and the link, which players paste into any chat. The template's version adds buttons that post the same line on X or LINE.

Either way, the post carries text and the link. The page doesn't make a picture of each player's score. For a picture, players take a screenshot.

What a test on Convika can't do

  • No leaderboard on another server. A page on Convika can't send scores to a leaderboard service. With the prompt above, each player sees only their own best. A page that saves scores with window.storage's shared values, as Claude artifacts do, keeps one shared list on Convika that every player sees; Convika has no leaderboard feature or player accounts of its own.
  • No list of who played. The dashboard shows how many people visited and where they came from, for the last 90 days on Free. It doesn't show names or scores. Free includes 10,000 page views a month.

Frequently asked questions

Can AI make a reaction time test?

Yes. ChatGPT, Claude, and Gemini can each write a reaction time test as one HTML file. Ask for a random wait, a color change, a timer that uses performance.now(), a rule for early taps, and the average of 5 rounds. The instructions on this page include all of these.

How do I host a small HTML game for free?

Upload the HTML file to a free host and share the link it gives you. On Convika's Free plan you can publish 1 page with no credit card, and players open the link in any browser. How to publish a game you made with ChatGPT compares 5 free hosts.

Can players see a leaderboard?

Not with the prompt above. Each player's best time stays in their own browser, and a Convika page can't send scores to a leaderboard server. A page that saves scores with window.storage's shared values, as Claude artifacts do, keeps one list on Convika that every player sees; Convika has no leaderboard feature of its own. Players can also compare by sharing screenshots or by pasting the line the score button copies.

Does a reaction time test work on a phone?

Yes, if the page treats the whole screen as the tap area and uses touch-action: manipulation so quick taps don't zoom. Try your preview on your own phone before you send the link, and tap early once to check the false-start rule.

Where is the best time saved?

In the player's own browser, in localStorage. It stays after the tab closes but not in a private window, and it doesn't move to another browser, another device, or a new address for the page.

Sources

Next step

How to password protect an HTML page without code, on your own domain

JavaScript passwords sit in the page code. Put an HTML page from ChatGPT or Claude behind a server-checked password on your own domain.

Related articles

More ways to send your page

Share this article

Give your reaction test a link anyone can open

Upload the HTML file, play it in a private preview, then publish it. You also see how many people came to play.

Publish my test for free

Free plan: no credit card, 1 published page.