409: Our Own Script Injection
Chris Coyier |
Chris and Stephen talk about how we use a Cloudflare Worker & HTMLRewriter to inject a very special <script> tag into the previews of the Pens you work on. This script has a lot of important jobs so it’s presence is crucial, and getting it in there reliably can is a bit of a challenge. […]... read more
Chris’ Corner: Terminological Fading
Chris Coyier |
I found myself saying “The Edge” in a recent podcast with Stephen. I was talking about some server-side JavaScript that executes during a web request, and that it was advantageous that it happens at CDN nodes around the world rather than at one location only, so that it’s fast. That was kinda the wh... read more
408: Proxied Third-Party JavaScript
Chris Coyier |
Chris and Stephen hop on the podcast to discuss the concept of a proxy. Possibly the most “gray hat” thing that CodePen does. We use a third-party analytics tool called Fullres. We could just put a link to the <script> necessary to make that work directly to fullres.com, but being an analytics... read more
Chris’ Corner: Simple, Accessible Multi-Select UI
Chris Coyier |
There’s a nice article by Enzo Manuel Mangano called Checkbox Interactions – The beauty of Layout Animations. In the end, you get some nicely animated checkboxes, essentially: I like it. It’s a modern-looking multiple-choice with very clear UX. Enzo’s tutorial is all React Native-ified. I think Enzo... read more
407: Our Own CDN
Chris Coyier |
Robert and Chris jump on to talk about our little CDN project. Maybe that’s not the right term, but we struggled with naming it. Truth be told, it’s the /public/ folder in our monorepo, where the purpose is getting files to the world wide internet at URLs that anyone can access. Our favicon is a […]... read more
Chris’ Corner: Clever Clever
Chris Coyier |
David Darnes made a <code-pen> web component, which is a basic HTML/CSS/JS panel layout that renders them into an iframe (using the very cool <syntax-highlight> web component as well). Then it ate itself when Ariel Salminen put a <code-pen> in a <code-pen>. Then the universe ... read more
406: Hot Trends of 2025
Chris Coyier |
Marie and Chris jump on to discuss some of the trends of what people are building on CodePen here, approximately halfway through 2025. New CSS! Hot Styles Hot Pens Time Jumps... read more
Chris’ Corner: Pretty Palettes
Chris Coyier |
I’m not terribly good at picking a good color palette out of thin air. My go-to is a dark look with bright colored accents, but I’m wildly envious whenever I see a beautiful website with great looking colors that are very far away from what I could pull off. Sometimes, a little inspiration can go […... read more
405: Elasticsearch → Postgres Search
Chris Coyier |
Alex & Chris get into a fairly recent technological change at CodePen where we ditched our Elasticsearch implementation for just using our own Postgres database for search. Sometimes choices like this are more about team expertise, dev environment practicalities, and complexity tradeoffs. We fou... read more
Chris’ Corner: Faces
Chris Coyier |
It’s one of those weeks where I just feel like posting some specimen screenshots of new-to-me typefaces that I like and have saved.... read more