Scalable CSS

Dedicated tutorials and in-depth articles on Styled Components, BEM, CSS architecture & more.

By Tom Ray, a front-end developer who lives in London with his fiancée and cat Arnold.

August 09, 2020

This is a quick start guide to learning Styled Components, the component-driven CSS methodology used in React. If you want to start…

June 02, 2020

If you've opted to use styled-components as a solution for managing your CSS, you'll quickly ask yourself: The Styled Components library…

May 25, 2020

When learning styled components, you may have noticed the use of attrs and be thinking: Huh. What does this do? When would I need to use…

February 18, 2020

Are you unclear on BEM best practices for the naming conventions of wrapper and container CSS classes? For example, you might have…

January 21, 2020

Understanding the basic concept of BEM (block, element, and modifier) is a fairly simple concept to grasp. However, things can start to…

January 14, 2020

This is a quick start guide to learning BEM , the component-driven CSS methodology. If you want to start practicing and applying BEM to…

December 31, 2019

Sass has been around for over 10 years now. It's worth asking: Is Sass worth learning going into 2020? Is it still a relevant way to keep…

December 24, 2019

“I have 4 .css files and in total, they’re over 10,000 lines of code. How did things get so big?” CSS files can get out of control, pretty…

December 05, 2019

When you're practicing the BEM methodology and you have components within components, it's difficult to know the most efficient (and BEM…

December 02, 2019

Learning BEM can be a little abstract without looking at real CSS examples of how it's applied. So in this article, I'm going to dive into…

November 19, 2019

In this post, I'm going to show you step by step how to set up custom fonts on your website in CSS using @font-face . Ready? Let's dive in…