Voice Auth Login Block for React

No. The page never calls getUserMedia or records audio: the take is 18 timers of 150 ms, the lit word follows the beat, and the bars take their heights from a fixed curve of the bar and the beat, never from sound. The result says that nothing was heard. In a product you would open the microphone only after Start, stream the audio to a speaker-verification service, and show its level in the bars.

Each of the three words stays lit for six beats, 900 ms, and the beat that follows the last one ends the take. A word that is said stays in the text colour, the one that is lit is inverted, and the ones to come are muted, so the state never relies on a hue. Stop clears the timer, resets the words and the bars and returns focus to the start button, which then reads Try again.

The bars hold one fixed shape while the take runs instead of changing every beat, and their transitions are switched off. The words still light up in turn, because that is how the take shows its progress, and the entrance on load is switched off.

Not on its own. A recording or a synthetic voice can fool a speaker check, so use a voice as a convenience beside something else, such as a device that is already trusted or a password. Keep the passphrase out of the page's text when the account holder should be the only one to know it; here it is shown because the demo needs a visible answer.

Voice can't be the only way in. The link under the button goes to a password form (point it at your own route), and the status line says in words when the take starts and ends, so a screen reader user isn't left guessing while the words light up.