0681

Duolingo Thermometer Slider

Duolingo Thermometer Slider

This interaction showcases a custom thermometer-style slider used for numerical input. The user drags a house-shaped handle along the scale, which dynamically fills the thermometer with a red liquid. Once a value is selected, the 'Check' button transitions from disabled to active with a vibrant green fill. Upon tapping 'Check', the thermometer liquid and handle instantly turn green to indicate a correct answer, accompanied by an animated celebration from the mascot, a smooth progress bar update, and a bouncy '10 in a row' badge reveal.