Preview of breakpoints change (inside the page)


I would like to do preview of change of the div’s width (inside the page). You can see something similar here:

I want it to be a “draggable” element (same as in the above example)

Depending on the width - I would like the name of the specific breakpoint to be marked. E.g:
for web:

for tablet:

for mobile:

I am asking for any advice - how can I do it best!