A telephone keypad has a sound that is recognizable before anyone sees the device. The Old Phone Tone Number Pad recreates that interaction in a browser.
The page provides the familiar digits, star, and hash keys, plus a display and clear and backspace controls. It accepts clicks, taps, and keyboard input, so the interaction is not tied to one kind of screen.
The tones are generated using the browser’s audio capabilities. Each keypad entry uses a pair of frequencies, with oscillators starting and stopping as the input is pressed and released. That creates the familiar dual-tone behavior rather than playing a separate recording for every button.
Keeping the input state clear is part of the job. The visible button, displayed digits, and active sound should agree about what is being pressed. Releasing the input should stop the tone instead of leaving an oscillator playing in the background.
This is an audio keypad demonstration. It does not place calls or turn the browser into a telephone service. Its value is in recreating a familiar interface and exploring the mechanics behind the sound.
The feedback is immediate. Press a key and the browser produces something recognizable from a small amount of code. It is a good example of a project that can be both nostalgic and technically interesting without growing into a larger app.
The result is a tiny bit of old-phone behavior on a modern screen, complete with the ability to clear whatever number the experiment produced.
Update history
These notes record article updates associated with repository changes. The original publication date is retained.
- — Converted automated article narration to neutral third person and added public update history. No application functionality changed. GitHub source