Pass Data from CSS to JavaScript with CSS Variables

What happens when you combine the fact that part after the : for CSS Custom Properties doesn’t need to be valid CSS with window.getComputedStyle()? You get a way of passing data – including Arrays, Objects, and even JSON – from CSS to JavaScript. Psst… Hey kid… Did you know you can pass data from your […]

“Redefining the Technical Possibilities of CSS” by Rachel Andrew

If you’re looking for a good video on the possibilities of Modern CSS (“CSS X”?), check out this talk by Rachel Andrew. She’ll get you up to speed with things: Over the last few years, rapid browser implementation of advances in CSS have given us the ability to do many of these previously impossible things. […]

Styling Scrollbars with CSS: The Modern Way to Style Scrollbars

Since the early days of the web, customizing the browser’s scrollbar has proven to be very difficult to standardize across major browsers. Fortunately, on September 2018 a W3C Working Draft called CSS Scrollbars was released that looks like a viable way to finally accomplish this! Turns out the ::-webkit-scrollbar-* pseudo selectors (which never were are […]

Playing With Particles Using the Web Animations API

Louis Hoebregts writing for CSS-Tricks When it comes to motion and animations, there is probably nothing I love more than particles. This is why every time I explore new technologies I always end up creating demos with as many particles as I can. In this post, we’ll make even more particle magic using the Web […]

Indicating Scroll Position on a Page With CSS

Scroll-based features tend to involve some bespoke concoction of CSS and JavaScript. But what if we could accomplish something that only uses CSS? Take this ingenious horizontal scrollbar with CSS, for instance. I want to do something similar, but to indicate scrolled sections rather than capture continuous scrolling. In other words, rather than increasing the […]