The main idea is simple: You write your main rule using CSS variables, and then use :nth-of-*() rules to set these variables to something different every N items. If you use enough variables, and choose your Ns for them to be prime numbers, you reach a good appearance of pseudo-randomness with relatively small Ns.
This was one of my favourite bits to make by far. A little animated me that responds to the cursor position. In this post we’ll cover how to get values from the mouse movement and plug them into an animation.
Things move a lot faster than they used to in terms of the implementation of Web Platform features, and this post is a round-up of news about CSS features that are making their way into the platform.
In our ongoing push for practices that produce inclusive and accessible experiences by default, we need our performance metrics to be inclusive as well. We should want to know if our patterns are optimizing for visual use cases at the expense of others, particularly when many of these patterns excel at making increasingly-slower applications seem like they’re loading fast, perhaps enabling worse real-world performance for many.
What does the everyday job of a frontend developer really look like? Which solutions do you really use? And which would you like to use but the employer won’t let you? It’s time to describe the real State of Frontend 2020.
In this dynamic talk, Una goes over the power of modern CSS layout techniques by highlighting a few key terms and how much detail can be described in a single line of code. Learn a few layout tricks you can implement in your codebase today, and be able to write entire swaths of layout with just a few lines of code.
Thanks to Cloud Four for sponsoring this week’s newsletter! If you’d like to help with the costs of running Friday Front-End, you can back our Patreon for as little as a dollar a month.