This article walks through new CSS features like `::scroll-button()` and `::scroll-marker()` that make it possible to build fully functional CSS-only carousels.

LogRocket is a frontend monitoring platform that helps developers debug and troubleshoot issues in web applications by providing session replay, error tracking, and performance monitoring capabilities. With LogRocket, developers can gain insights into user interactions, identify bugs, and optimize application performance to deliver better user experiences. Developers can learn how to integrate LogRocket into their web applications, analyze user sessions, and diagnose frontend issues effectively.

LogRocket

Chrome 135 introduces new CSS pseudo-elements ::scroll-button() and ::scroll-marker() that enable building fully functional carousels without JavaScript. These features create interactive scroll buttons and visual markers with built-in accessibility support, including automatic screen reader announcements and keyboard navigation. The pseudo-elements work with existing CSS features like scroll-snap-type for smooth navigation and can be styled like regular HTML elements.

Modern CSS carousels: No JavaScript required

See how LogRocket's Galileo AI surfaces the most severe issues for you

Over 200k developers use LogRocket to create better digital experiences

Is your frontend hogging your users' CPU?

<p>Very informative tutorial, monke approves</p>


<p>I used this, its nice and clearly understand</p>
