Skip to main content

Custom range slider with tooltip II

After the previous concept, here is another idea of range slider. The tooltip will adjust its shape to stay within the boundaries of the slider. Even the radius will adjust when the tail get closer to the corners.

CSS-only range slider with tooltip

Powered by modern CSS features:

See the Pen CSS-only Custom range slider by Temani Afif (@t_afif) on CodePen.