With CodePen 2.0, we’ve got a new word we’re using: Blocks. A way to think about Blocks is anything that processes code. They are added as steps to the CodePen Compiler as needed. For example, TypeScript is a block, because it processes files in the TypeScript syntax into JavaScript files. But something like Lodash is […]

As of January, with Firefox 147’s release, Anchor Positioning is supported across all major browsers. I’m happy about that, of course. I think Anchor Positioning is really powerful and a layout mechanism we probably should have had a long time ago. My enthusiasm was tempered when I found out how finicky it can, simply not […]

CodePen 2.0 was the most ambitious project that we’ve ever taken on in our lives. Why would we do such a thing? Chris and Alex explain the thinking behind it. We’ve been around a long time, know what our customers want, and are developers ourselves, so we know how this industry moves. We thought we […]

Dave has this classic idea for a Web Components Sommelier. Like many of Dave’s ideas, it’s equal parts joke and brilliance. The idea is a person with deep knowledge of an absolute ton of different Web Components who can suggest ones that do just the right thing in any situation. Like a wine sommelier who […]

You can kinda smell a vibe-coded app these days. TypingSVG has that odor, but like… in a good way? An app like this absolutely should exist. Someone needed it, and how instead of it just being some little tool they’ve tucked away for themselves or thrown away, they tossed it up on some inexpensive hosting […]

Chris Coyier and Stephen Shaw discuss the transition from CodeMirror 5 to CodeMirror 6, highlighting the significant improvements in accessibility, performance, and user experience. They delve into architectural changes, integration with modern JavaScript frameworks such as Next.js, and the new theming options available in the editor. Time Jumps

Individual fresh CSS features can be amazing, but I always say it’s the most impressive when they go together. Adam Argyle knocked one out of the park with his modestly named Nice Select post & demo. His own post lists all the CSS features that went into it, but I’ll do a quick overview. And […]

Andy Bell with pitch perfect bait for me: Fun shadow coding challenge. Just a simple line across a page, but imagine that line is a light source. Squares below the light source have a box-shadow. How can we make it so as the squares scroll by, that box-shadow adjusts itself to honor that “light source”? […]

Can you reason out the difference between a selector doing :has(:not) vs :not(:has)? Kilian Valkhof wrote up that post I just linked to. I like how he teaches the way to think it out is to write out all the implied selectors at work. For instance: is really: The latter becomes a lot more clear […]

Have you seen Kiel Danger Mutschelknaus’ Space Type Generator? This thing is absolute monster of amazing text-on<canvas> effects. Bought a coffee for this beautiful bit of work for sure. The effect you see when landing on that homepage is extremely cool. Playing around with the sliders and presets make for almost entirely different demos, each […]