Hello Reader,

The normal general musings I usually open this up with will follow, but CSS has a new logo.

CSS Next opened up submissions a while back, and this was the eventual winner, with a nice touch in using rebeccapurple as the color for it.

You can see the different submissions and progress that was made in this repo​

One of the reasons for needing a new logo is the upcoming new “versions” of CSS that will be happening, with CSS4 and CSS5 on their way.

💭 General musings

I’ve been in Minneapolis for this past week to give a Frontend Masters workshop, and during a break I was talking to one of the in-person students, who mentioned how it can be overwhelming when there are multiple acceptable solutions to a given problem.

And… yeah, I get it.

I wish there was one way to do things as well, it would make teaching all of this stuff easier!

The problem is, often there is a lot of nuance into why one solution might be better, and other times, it just comes down to vibes.

Basically any way we write CSS is rather opinionated, from how heavy handed our reset is (like, do we really need a * { margin: 0; }) to how we chose to create modifier classes… it’s all vibes, right?

Now don’t get me wrong, there are best practices, but thanks to some new, modern CSS features (like layers and scope), some of those might even slowly start changing too!

One thing I wanted to hammer home during the workshop was also how my approach to writing CSS has changed over the years.

I used to love BEM.

As time went on, I diverged away from it with certain things, to the point where I basically dropped it for a lot of utility classes (not full-on, but I had a lot), and then the pendulum balanced out a little, and I found myself in a bit of a middle ground.

I’m a big fan of advocating for a balance between utility classes and “just make a class for it”, even if you’re using a component-based JS framework.

But while I’ll advocate for that, I’m also very aware that it’s how I like to write CSS.

There are pros and cons to my approach.

Well, there are pros and cons to every approach.

And that’s the important thing to remember.

You might like a certain way of doing things over all else. To you it feels “right” or “the best way”.

And if it works well for you, then for you it the right way.

But Your Right Way isn’t The Right Way.

And this isn’t only true for CSS, obviously, but it’s what I know well enough to both have an opinion on, but also realize that it is only that, an opinion.

And honestly, I think the best thing for anyone, if they have the time to do it, is to try other ways of doing things.

If you’ve never used Tailwind and hate everything about it, that’s all the more reason to make a small personal project with it.

Or, if you love Tailwind and it’s all you use, go and create a small project with vanilla CSS, where you’re using BEM.

When you’re done with either of those, you might still hate the things you played with when you’re done, and that’s fine… but you might find a few things in there you sort of, kind of like, even though it can be hard to admit at first.

And the same can go for smaller things too.

Have you ever tried using data-attributes as modifiers instead of a modifier class?

If you’ve never done it, it looks really strange, but once you have tried it out, you might actually kind of like it! Specially if it’s for something where you need to use the data attributes with JS as well.

And I’ll finish things off by saying I also realize you might not have a choice in the matter.

You might be working at a company where you have to use their custom system, or have to use Tailwind, and then when you get home from work, you don’t particularly feel like playing around with CSS to wind down (though I bet a lot of people who read this newsletter might like doing that 😅).

But if you do have a little time to experiment and try new things, I strongly encourage it!

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

A missing Figma feature that we’ve had in other software for decades

​

There is a strange disconnect between how the web works and how Figma works, considering it’s a tool for designing websites and apps.

Typography is the place where this is most obvious, but the crazy part is how InDesign had long figured this out decades ago.

HTML inputs are more powerful than you might realize

​

A quick one looking at a the benefits of the number and color input types.

I know native inputs can be hard to style (and number inputs aren’t as straight-forward as they probably should be), but building out custom solutions that have all of the same functionality and built-in accessibility is very hard as well.

🏁 </newsletter>

Have a fantastic week!
Kevin

​Unsubscribe · Preferences​
113 Cherry St #92768, Seattle, WA 98104-2205