Latest News

Tyler Sticka on the complexity of designing buttons and making sure that we’ve taken into consideration focus, hover and active states during the design process:

In truth, mouse effects are probably the least important state to design for. By accounting for more functional states early, you can lower the need for costly redesigns as your pattern library matures. Here are the fundamental states you should address early on, in approximate order of importance.

I’ve been spending a lot more time …

The post Designing Button States appeared first on CSS-Tricks.

A huge high-five and welcome to Netlify for the sponsorship this week.

If you haven’t heard of Netlify, the big thing you should know is that it’s web hosting, but more than that. It’s web hosting with the developer workflow squarely at heart. You can spin up a site on Netlify in literally seconds. One way is through their robust CLI. Another way, that I find very comfortable (and just did the other day), is to log into the Netlify …

The post Static File Hosting Doesn’t Have To Be So… Static appeared first on CSS-Tricks.

Brad frost picks up the ongoing conversation about design systems. Where many posts seem to center on how to create one and how to enforce it, the big takeaway here is that design systems are not synonymous with constraints. They’re only as strict as we make them and new CSS features like custom properties actually open up new creative possibilities—something Andres Galante and Cliff Pyles recently pitched right here on CSS-Tricks.

Brad:

The aesthetic layer is often the most malleable …

The post Creating Themeable Design Systems appeared first on CSS-Tricks.

I was talking with a pal the other day and moaning about flexbox for the millionth time because I had momentarily forgotten the difference between the justify-content and align-items properties.

“How do I center an element horizontally with flex again?” I wondered. Well, that was when she gave me what I think is the best shorthand way of remembering how the two work together.

She said that justify-content positions elements across the horizontal axis because the word itself is longer …

The post A Quick Way to Remember the Difference Between `justify-content` and `align-items` appeared first on CSS-Tricks.

(This is a sponsored post.)

Who said collecting data was easy? JotForm did. In today’s world, getting relevant data has never been more important for making informed business decisions. The thing is, companies still struggle with it because the forms they use for gathering information don’t typically resonate with their customers. Until now that is. With JotForm’s newest format, JotForm Cards, your online forms have all the same power of traditional forms, but with added benefits: they’re friendlier, sleeker, …

The post ​The future of data collection is here appeared first on CSS-Tricks.

An oldie but goodie, Chris Beams writes about the secret art of writing helpful Git commit messages. Here’s why he thinks it’s so important:

If you haven’t given much thought to what makes a great Git commit message, it may be the case that you haven’t spent much time using git log and related tools. There is a vicious cycle here: because the commit history is unstructured and inconsistent, one doesn’t spend much time using or taking care of it. …

The post How to Write a Git Commit Message appeared first on CSS-Tricks.