DigitalOcean has killed CSS-Tricks... again


​View this email in your browser (or share it with a friend!)

PRE-S: After years of people telling me how amazing an event it is, I’m so thrilled to let you know that I’ll be speaking at Beyond Tellerrand in Düsseldorf in April of 2027. Even though they've just started to announce speakers, tickets look like they are selling fast... just saying 😉

Hello Reader,

I wanted to talk about something else this week, but I’ve stuck it in my draft for next week instead, because I think what’s currently happening with CSS-Tricks needs talking about.

If you haven’t heard, DigitalOcean has essentially killed it for a second time.

Not as part of a round of layoffs (which is what happened the first time around), but because they’ve simply stopped paying the people responsible for the content on the site, essentially ghosting the editor, Geoff Graham.

It’s wild to me that a company of their size, worth over $10 billion, would just ghost their editor who they still owe for several months of work.

Making the optics worse, they donated $3 million to Omarchy last week, which, given the timing of ghosting one of their own publications, ignores the potential politics of funding a DHH project.

Anyway, I talked about this in a bit more detail in a video over on the second channel (it’s back!) if you’re interested.

video preview​

🙋‍♂️ What I’ve been up to this week

📺 Fixing fluid typography

video preview​

Fluid type built on clamp() and viewport units can be a little annoying to work with, especially when font sizes continue to grow if the wrapper or container they are in has already hit it’s max width.

One solution is to use container query units instead, but that can lead to inconsistent font sizes… unless you register your custom property!

By registering it, we can lock the calculated value in based on whichever container we want!


⚡ What unit do devs use the most often?

video preview​

Another Front-end Family Feud, this time with Alex Trost guessing which unit devs reach for most in production. You can probably guess the top one, but after that it gets a little tricky!

A shoutout to Project Wallace for providing the stats.

📝 Quiz time!

--brand is set to an oklch() color. Which color space does alpha(from var(--brand) / 50%) resolve in?

  • Always sRGB, since that’s what the web defaults to
  • HSL, because alpha() is built on hsl()
  • The same space as –brand, so oklch
  • You have to add an in keyword, or the declaration is invalid

As usual, you'll have to head on over to YouTube to take a stab at the quiz, and once you answer, you'll see if you were right or not.

​

Have a fantastic week!
Kevin

P.S. A PRE-S and P.S in the same email? Wild things happening this week here in the newsletter 😅... anyway, if the video on the fluid type had you a little confused, that’s normal. It’s kind of weird how registered custom props work, but it also opens up some incredibly powerful things that we can do, other than simply animating the colors in a gradient.

I’m currently working on the next module of CSS Demystified, and in that module I have a few lessons on registered custom props. It’s not out yet, but why not get a head start on the other content so that you’re ready for when I release it? 😉

If you are interested, you can enroll right here.


If you no longer want to get any emails from me, you can unsubscribe or you can edit your preferences if you'd like pick which emails you get from me.
600 1st Ave, Ste 330 PMB 92768, Seattle, WA 98104-2246

Hi! I'm Kevin

Weekly newsletter, where I talk about tangentially-related front-end development topics and share what I've been up to in the last week, plus any cool/fun/interesting/useful links I come across as well.

Read more from Hi! I'm Kevin

View this email in your browser (or share it with a friend!) Hello Reader, Last week, I said most CSS problems come from a layer underneath the properties themselves. Here's one piece of that layer that almost nobody talks about. The browser creates boxes you never told it to. Take a simple <button class="button">Click me</button> There's one element there. But sometimes, there are two boxes... For example, if I did this: No typo here, this is using the two-keyword syntax for the display...

View this email in your browser (or share it with a friend!) PRE-S: You can help shape the future of the web by ranking the Interop 2027 proposals. There are a lot of them, but they’re just asking you to pick the ones that are important to you, and rank the ones you’ve picked. I’ll probably be sharing my ranks next week. Hello Reader, So it turns out that Opus 5.5 is very good at decompiling things. This has led to some mostly silly things, like Minecraft in Elden Ring and Mario in Halo, but...

View this email in your browser (or share it with a friend!) Hello Reader, I’ve been seeing questions like this one more and more often these days. I have a lot of thoughts on this that I’m trying to put together for something bigger, but these are the main reasons I keep making CSS tutorials: First, the obvious one: I like CSS! And I like to show what’s possible, and show that it can be fun and rewarding The second point, specifically showing what’s possible, I think is the important part....