Josh W. Comeau

Woman eating dinner with book

Book cover with tropes and emojis and quotes and the words What would The Fae watch on TV?

Did you know that my next "funny as hell" fantasy, "We Interrupt This Program" about what happens when things go ungodly (or ungoddess-ly?) wrong in a magical "Murder She Wrote" style town -- is OUT? Go grab this "hilarious but heartfelt book" now!📚👀📺😅

Buy here ==> geni.us/weinterrupt

did u know new sata ssds are mostly empty inside but just the right size for a custom enclosure

Now that shape() is available in all major browsers, let me remind you that you can use my online generator to create any polygon with ... rounded corners!

css-generators.com/polygon-shape/

Adjust the setting, then copy the code.

It's all done now, all the filming took place over 1 week. It's like Survivor; the winner is crowned before the show starts airing, but we’re all sworn to secrecy 😅

I don't really enjoy making videos. 😅

I make quite a few for my courses and I don't have the enthusiasm to do more than that.

Totally 😂. Add in the fact that you can see your opponent’s progress (on the real one) and you know that thousands of people will watch your attempt, and it’s basically impossible.

this is fun — if you wanted to try the MadCSS challenge, check this out

Also I think they might run this again next year, and if so, I’d love to see you as a participant! CC @w3cj.com @wesbos.com @tolin.ski

I would guess that most of the participants so far use grid regularly, but in a high-stress environment, it’s all instinct. I know for myself (airing next week), my brain was barely working and it’s a miracle I remembered any CSS 😂

there's so much bad in the world but there's also people who lift up and carry an elderly bat around every day so he can pretend he's flying again, and that's the part of the world I think is worth fighting for

Congrats, @kevinpowell.co! Huge achievement 💯

Have you seen what’s going on with npmx? From what I’ve seen, it feels like the good ol days of open source.

Though, the fact that I can only list 1 project like that sorta proves your point 😅. What used to be common is now quite rare.

@wesbos.com I’d be curious what % of people successfully guessed the first 4 Mad CSS matches! I’ve seen a few people say they’re 4 for 4, but I’m guessing that’s actually quite rare?

Adventures in subgrid Recently, I have solved several CSS layout problems using subgrid. I share my examples and refer to some other subgrid solutions in an article by Josh Comeau.

I have used subgrid to solve several layout problems recently in my work. I share lessons that I have learned and examples. I also point to some examples in @joshwcomeau.com's recent article on subgrid.

jeffbridgforth.com/adventures-i...

Wow! That’s impressive. It's so hard to predict who will succeed in this format 😂.

Amazing how we went from not being able to style selects, to doing things like this with them codepen.io/editor/cbols... (and this codepen.io/t_afif/pen/P...)

I do love this structure 😄

Ok this is *fantastic.* I was wondering if the edit would capture just how tense these matches are, and the editors got it exactly right. 💯

The production value is ridiculously good, too. Feels like this should be on Netflix!

The first half of the bracket airs in 10 minutes! 🍿

I'll be hanging out in the chat for the premiere. Come hang out :D

The March Mad CSS website is so cool. They added a feed showing who people are picking in realtime.

Today’s the last day to fill in your bracket!
madcss.com

Ohh, this is super cool! You can play along, and see if you can do better than the competitors. 😄

Episode 1 is the left side of the bracket: @adamwathan.com @bytesofbree.bsky.social, @chriscoyier.net, @jason.energy, @miocene.io, Kyle Cook, @tolin.ski, and @shaundai.com.

I’m on the right side of the bracket, which airs next Friday.

The madness starts tomorrow at 10AM ET on YouTube! I’ll be hanging out in the livestream chat, should be a lot of fun. 😄

If you haven’t already, you can build your own bracket and predict who’ll win. ✨

The Layout Maestro An interactive course focused on how to think, build, and test a layout with real-world examples.

⌛ Sending an email update about The Layout Maestro course in a few hours including release date, pricing, and more.

If you want to be the first to know (and get a discounted price), subscribe to the newsletter: layoutmaestro.ishadeed.com

WebHaptics – Haptic feedback for the mobile web. Haptic feedback for the mobile web.

this is so cool
haptics.lochie.me

Man @nerdy.dev absolutely coming out on top for the MadCSS.com picks.

I'm a little hurt only 5% of you think I'd win

I’m working on the final part of Whimsical Animations, all about Canvas animation. There’s such fun examples in this part, from confetti geysers to fireworks displays. 😄

Here’s one of the smaller exercises leading up to the big stuff. 🚀

A clean looking graphic with sharp lines and crisp colour

The same graphic, but muddy and blocky. The previously sharp lines are blurry.

I think it's often overlooked that AVIF is also really good at flat colour & sharp edges.

Don't go straight for a lossless format just because it's the kind of image that would look bad as a JPEG.

Here's an 11kb image as an AVIF, vs JPEG XL.

const CloseButton = styled.button` position: absolute; top: 0; right: 0; padding: 16px; transform: translateY(-100%); color: var(--color-text); html[data-color-mode='dark'] & { color: white; } @media ${BREAKPOINTS.smAndSmaller} { html[data-color-mode] & { z-index: 2; transform: revert; color: black; } } `;

If you’re wondering what all of those 1-level-deep nested selectors are, it's usually me applying different styles based on the color mode, which I read from the HTML tag.

For example:

Graph showing "Selector nesting depth". I have 547 flat selectors, 80 selectors that are nested 1 level deep, and 1 selector that is nested 2 levels deep.

I learned about Project Wallace (www.projectwallace.com) from @kevinpowell.co’s latest F1 video, and it's fun seeing the analysis for my own site!

I really try to avoid nested styles, and happily it seems like I’ve done a pretty good job at that. 😄