Is Sass Dead? Or Are We Just Finally Growing Up? 🎨

The "Old Reliable" is Starting to Look Like a Horse and Buggy
The Color Revolution: OKLCH and Color-mix
The Metaphor: The Heavy Toolbox vs. The Swiss Army Knife
Is there any reason to keep Sass?
Final Thoughts: The Verdict

Let’s be real for a second: for the last decade, Sass (SCSS) was the cool older sibling of CSS. It had the car, the leather jacket, and the ability to do math. CSS was the kid brother sitting in the corner, struggling to center a div without crying.

But lately? CSS has been hitting the gym. Hard. It’s grown up, got its degree, and is now showing up to the party with features that make us wonder: Why are we still paying the "compilation tax" for Sass?

The "Old Reliable" is Starting to Look Like a Horse and Buggy

Remember when we used Sass solely because it let us nest our selectors? Writing flat CSS felt like trying to organize a library by throwing books into one giant pile.

But now, Native CSS Nesting has arrived in all modern browsers. It’s like we finally discovered that folders exist.

/* Look Ma, no Preprocessor! */
.card {
  background: white;
  padding: 1rem;

  & .title {
    font-weight: bold;
    color: oklch(45% 0.15 250);
  }

  &:hover {
    border: 1px solid hotpink;
  }
}

If you showed this to a dev from 2015, they’d ask you which version of Node you’re using to compile it. The answer? None. It’s just... CSS. It’s beautiful. It’s like finding out your car can fly and you’ve been driving on the 405 this whole time.

The Color Revolution: OKLCH and Color-mix

Sass used to be the king of color manipulation. lighten($color, 10%) was the bread and butter of every UI kit. But Sass functions are calculated at build time. They are static. They are "baked in" like a raisin in a cookie—once it's in there, it’s not changing.

Enter color-mix() and oklch(). These are runtime powerhouses.

:root {
  --primary: #3498db;
}

.button {
  /* Dynamic lightening based on the actual computed color! */
  background: color-mix(in srgb, var(--primary), white 20%);
  
  /* Using OKLCH for consistent perceived brightness */
  color: oklch(90% 0.05 250); 
}

Using oklch() is like finally getting a high-definition TV after staring at a grainy black-and-white box. It handles human perception of brightness so much better than RGB or HEX ever could. If you want a darker version of a color, you just tweak the "L" (Lightness) value, and it actually looks darker without becoming a muddy grey mess.

The Metaphor: The Heavy Toolbox vs. The Swiss Army Knife

Using Sass in 2025 is a bit like carrying a heavy, industrial-sized toolbox to hang a single picture frame. Sure, that massive power drill (Sass) is impressive, but you’ve already got a multi-tool (Modern CSS) in your pocket that does the job without needing an extension cord (Node.js/Rollup).

The Compilation Tax is real. Every time you save a .scss file, a watcher has to wake up, drink some RAM coffee, and rebuild your CSS. With native CSS, you save the file, and the browser—which is already a C++ beast optimized for this exact task—just handles it.

Is there any reason to keep Sass?

Look, I’m an expert, but I’m not a zealot. Sass still has Mixins and Functions that can do complex logic. If you are building a massive design system where you need to loop through a map of 500 tokens to generate utility classes, Sass is still your best friend.

But for the 95% of us building apps with React, Next.js, or Vue? We usually handle that logic in JavaScript anyway. Tailwind CSS has also eaten a huge chunk of the "I need variables and nesting" pie.

Final Thoughts: The Verdict

Sass isn't "dead" in the sense that it disappeared; it’s just becoming the jQuery of styling. It paved the way, showed us what was possible, and then CSS absorbed its soul like a technical Shang Tsung.

I’m calling it: For new projects, drop the .scss extension. Embrace the platform. Use those native variables, use that nesting, and for heaven's sake, start using oklch() before the design police come for you.

What about you? Are you ready to delete your sass-loader and never look back, or are you clutching your @extend directives with white knuckles?

Write me an Email on: kontakt@janwalenda.de