Faded Scroll Area


For thinner scroll surfaces, such as a tab bar, showing a scrollbar can obstruct elements, take up unwanted space, and look out of place. Indicating overflow can also be tricky if the border just happens to overlap with the end of a child component.



Good design often has roots in the real world. To model overflow behavior, we might be inspired by a tape measure, which has a clear cutoff and a slight shadow.



Source code