Latest News

Bower and npm are de-facto the package managers of the web. I doubt there are many front-end developers out there who haven’t heard of them or used them to manage dependencies.

Whilst many of us use them as consumers, one day you might decide to share a project of your own and become a contributor! This happened to me recently. I had the experience of publishing my open-source library on npm and Bower.

Although their official docs were quite good, …

Gotchas When Publishing Modules in npm and Bower is a post from CSS-Tricks

In part one of a series of posts about optical illusions on the web, Dan Wilson looks at how to create the “Red Reveal” that he happens to describe like this:

Growing up, my family played a lot of board games. Several games such as Outburst, Password, and Clue Jr. included something that amazed me at the time — a red lens and cards with some light blue text that was obscured by a myriad of red lines. When you …

The Red Reveal: Illusions on the Web is a post from CSS-Tricks

Some people have a talk-preparation process that is super organized and runs like a well-oiled machine. Mine, on the other hand, is a bit messy, but it works for me. Even when the end talk is polished and put together, it doesn’t mean the whole process to get there was the same way.

When putting together a new talk recently, I noticed there was most definitely a pattern to how my talks take shape. Here’s how the talk-making process goes for me

My Talk Writing Process is a post from CSS-Tricks

System font stacks got hot about a year ago, no doubt influenced by Mark Otto’s work putting them live on GitHub.

The why, to me, feels like (1) yay performance and (2) the site looks like the rest of the operating system. But to Mark:

Helvetica was created in 1957 when the personal computer was a pipe dream. Arial was created in 1982 and is available on 95% of computers across the web. Millions, if not billions, of web …

Shipping system fonts to GitHub.com is a post from CSS-Tricks

In CSS, you might see a ruleset like this:

html {
font-family: Lato, "Lucida Grande", Tahoma, Sans-Serif;
}

What the heck, right? Why don’t I just tell it what font I want to use and that’s that? The whole idea here is fallbacks. The browser will try to use the font you specified first (Lato, in this case), but if it doesn’t have that font available, it will keep going down that list. So to be really verbose here, …

CSS Basics: Fallback Font Stacks for More Robust Web Typography is a post from CSS-Tricks

I really like this post by Brad Frost about what is and isn’t a design system, particularly when he de-emphasizes the importance of tools when it comes to that sort of work :

…components living inside static design tools like Sketch isn’t itself a design system. Pardon my clickbait. Perhaps a better title would have been “Your Sketch library is not a(n entire) design system.”

No doubt tools like Sketch are super valuable, and having a set of reusable components …

Your Sketch library is not a design system redux is a post from CSS-Tricks