Specificity calculator with support for latest CSS features

If you're building a web experience and want to stay fast, a performance budget can be critical. For success, embrace performance budgets and learn to live within them. Network & CPU limits on mobile can require asking hard questions like, "what is really important to my users?"

This book will assist frontend developers in building accessible e-commerce websites and components. #accessibility #html #css #tips

Design tokens are being used by companies like Amazon and Adobe to solve the pitfalls of coding a design system. I provide an introduction to design tokens.

A quick trick to create any kind of shape having rounded corners.

The CSS filter property provides a way to apply graphical effects on HTML elements. These effects go from blur to grayscale handling but can also include advanced filters using SVG. CSS filters are cross-browser supported and ready to use. If you haven't played around with them, you should give them a try!

CSS scroll snap examples from a presentation https://oh-snap.netlify.app/ by Adam Argyle at CSSDay 2022

A presentation at CSSDay 2022 by Chris Leeley

Fluid responsive design methodology

A presentation at CSSDay 2022 by Tab Atkins Jr.

I used to be a big fan of CSS-in-JS (JSS), but now I'm back to preprocessed CSS. Regression? Technophobia? Or justified choice? Let me explain.

If you work in the front-end, you've probably heard a lot about TailwindCSS, a CSS library, much like Bootstrap. Much unlike Bootstrap, however, Tailwind takes a different approach - it is all "utility classes".

And I am not a fan. I got a whiff of it and quickly learned the name is appropos: it was as welcome and useful as passed gas.

A visual way to analyze the specificity of selectors in CSS.

Make a smooth shadow, friend.

Styletron is an universal toolkit for component-oriented styling. It falls into the CSS in JS category. Styletron works great with React but can be used with other frameworks or plain JS as well.

Near-zero runtime, server-side rendering, multi-variant support, and a best-in-class developer experience.

Styled System lets you quickly build custom UI components with constraint-based style props based on scales defined in your theme.

Fela is a small, high-performant and framework-agnostic toolbelt to handle state-driven styling in JavaScript.