Fluid typography with CSS clamp
Learn to create a simple, accessibility friendly and configurable fluid type system that uses modern CSS sizing functions.
CSS Frameworks, hype and dogmatism
Some notes on the dogmatism and gatekeeping themes of Tech Twitter and how they can generate often incorrect and naive statements—specifically about frameworks and methodologies.
Add scroll margin to all elements which can be targeted
We can add an extra bit of space to targeted elements, thanks to modern CSS!
Control changing numbers with font variant numeric
Get the benefits of monospaced fonts with your favourite (supported) non-monospaced fonts.
Convert a 2D array into a flat, 1D array of unique items
Convert a messy multidimensional array into a nice single dimension array of unique items.
Use CSS Clamp to create a more flexible wrapper utility
A handy way to use modern CSS functions to give yourself fine-grained, yet flexible, design control.
Build a fully-responsive, progressively enhanced burger menu
In this premium tutorial, we’re going to build a burger menu from the ground up, using progressive enhancement, ResizeObserver, Proxy state and of course, super-solid HTML and CSS that pull from the CUBE CSS principles.
Load all focusable elements with JavaScript
A handy helper function that will load all user-focusable elements inside a parent element for you.
Dynamic footer copyright date in Eleventy
That time of the year is coming up, so this trick will keep your website footer up to date on your Eleventy site.