Front-end education for the real world. Since 2018.





  1. Applying P3 colours on an existing project

    The set.studio site is powered by design tokens, which for colours, are hex codes. I managed to automatically convert those to P3 colours with a custom PostCSS plugin.

    CSS

  2. Upcoming custom element support in React

    React’s version 19 Beta is boasting full custom element support so I cover how that could impact projects on our radar and how this new support will make an impact.

    React

  3. CSS inheritance

    Inheritance truly is a superpower and it’s what makes developing on the web a joy if you embrace it. In this quick post, I’m going to convert you into a super fan.

    CSS Fundamentals

  4. An evolution, not a revolution

    We’ve refreshed the look and feel of both the Piccalilli site and the brand so wrote up a little about that and the future of the platform.

    Announcements

  5. A primer on the cascade and specificity

    Often feared by developers, the cascade and specificity is actually really simple if you utilise the right mental model when authoring CSS.

    CSS Fundamentals

  6. I want to elevate more people with Piccalilli Links

    A big part of the Piccalilli Links thing is I want to elevate good writers. I need help discovering those writers though!

  7. How we’re approaching theming with modern CSS

    We’ve started a new project which requires heavy, creative theming, so I made a prototype to test some ideas out.

    CSS

  8. The box model and box sizing

    To open up this CSS Fundamentals series, we’re looking at one of those most important aspects of CSS to understand: how the box model is affected by box sizing.

    CSS

  9. Front-End solution: progress indicator

    All is revealed about how to build this Front-End Challenges Club challenge, with some great contributions to the community too.

    Front-End Challenges Club

  10. Some little ways I’m using CSS :has() in the real world

    I’ve created some low fidelity demos of :has() snippets that I’ve been using in real-world client projects.

    CSS