DEV Community

Cover image for The Rising Complexity of Modern CSS
Alex Beygi
Alex Beygi

Posted on

The Rising Complexity of Modern CSS

Modern CSS is nothing short of incredible. It gives us the tools to craft rich, interactive, and visually stunning experiences on the web. But with this surge in capability comes a new weakness—not in CSS itself, but in the way we work with it.

When I started my career as a web developer, writing CSS often meant inventing hacks to work around what it couldn’t do. Those days are far behind us. Today, CSS offers advanced layout systems, 3D transformations, and highly flexible animation tools.

Yet most of the challenges we face in modern CSS aren’t about missing features—they stem from how we author it. This is why the future of CSS might not live in plain text files at all, but in visual creation tools.

That idea might sound outrageous at first, but bear with me—I’ll try to make the case.

The Growing Complexity of Color

Developers have spent years building intuition around HEX and RGB. But new colour models like OKLCH require us to rethink that mental map entirely. You might instantly recognise a colour like #FF00FF, but oklch(0.7017 0.3225 328.36) is far less intuitive.

In the 2025 State of CSS survey, only 12% of respondents said they had tried any of the new level-4, wide-gamut color spaces and had a positive experience.

Gradients: A Perfect Case for Visual Tools

Gradients are a clear example of where visual editors shine.

Without something like https://gradient.style, working with gradients quickly becomes frustrating. Human brains simply aren’t built to imagine what a gradient such as:

linear-gradient(in srgb, 37deg, #8dea81 0%, #92d3d2 100%)

will look like—especially when different interpolation colour spaces can dramatically alter the result.

Animations: Even More Dependent on Visual Editing

Nowhere is this issue more apparent than with animation timing functions.

Translating sets of coordinates into a bezier curve—and then picturing how that curve will animate an element—is not something most people can do mentally. Tools that allow you to see and manipulate these curves visually are essentially required.

The newer linear() interpolation function unlocks some amazing possibilities—like mimicking realistic physical motion—but creating “spring” or “bounce” curves manually is nearly impossible without visual guidance.

Keyframe animations have the same problem. Basic from/to sequences are simple enough, but once you introduce multiple keyframes, editing and fine-tuning them becomes tedious. A dedicated keyframe editor removes that friction entirely.

Falling Behind the CSS Working Group

In the past, browser support was the main obstacle to adopting new CSS features. That’s no longer true. For example, offset-path has been fully supported in all major browsers since 2022—yet in the 2025 State of CSS survey, only 30% of participants even knew it existed.

As the specification grows, remembering how each feature works becomes increasingly difficult. Many new CSS capabilities see slow adoption simply because developers can’t keep up.

More Advanced Features on the Horizon

The brand-new shape() and path() functions are incredibly powerful, but crafting them manually can be tedious.

clip‑path: shape(from 87% 0.5%, hline to 1%, curve to 16% 52% with 1% 1% / 17% 17%, curve to 1% 100% with 16% 87% / 1% 100%, hline to 87%, curve to 100% 52% with 87% 100% / 100% 89%, curve to 87% 1% with 100% 15% / 87% 1%, close);

Other impressive features—like mask-image, offset-path, and conic-gradient—will likely remain underused simply because writing the CSS for them is so complex.

A New Era of CSS Tools

CSS has grown beyond what traditional text editors are comfortable handling—and that’s worth celebrating. Many developers already rely on visual tools to build gradients, paths, and animation timing functions, but these tools can go even further.

Not only do visual tools make it easier to define colours, gradients, and animations—they also introduce developers to features they may not have known about.

When new CSS capabilities are paired with intuitive visual interfaces, they become far more approachable and much easier to incorporate into everyday work.

Top comments (8)

Collapse
 
xwero profile image
david duymelinck

Isn't it up to the developers to know about the new things in their field?
I think the main problem is that a lot of developers focus on frameworks, and that is why they are blind for the new things in the languages they are using.

While I think a visual tool can be a productivity boost, I don't think it will solve the problem of using new features. Because instead of a framework you depend on the visual tool to introduce the new features of the language.

Collapse
 
louis7 profile image
Louis Liu

There are too many things for a web developer to learn. I think CSS is less important than other stuff, so I would rather allocate my time to learn JavaScript frameworks.

I can still use older CSS techniques to build a gorgeous web page. But can I build a site with vanilla JavaScript?

Collapse
 
xwero profile image
david duymelinck

I can still use older CSS techniques to build a gorgeous web page

Sure, but when there are new things that make is easier why not use it? The same goes for new things that unlock new possibilities.
If you don't know about the new things you are limiting yourself.

I think CSS is less important than other stuff

That is your choice. Not everyone need to be a visual developer. But if you go for a frontend position it will assume it is part of the skill set you keep improving.

Thread Thread
 
louis7 profile image
Louis Liu • Edited

Sure, but when there are new things that make is easier why not use it?

Based on what this post shows, it obviously doesn't make anything easier. I'm referring to The Growing Complexity of Color.

But if you go for a frontend position it will assume it is part of the skill set you keep improving.

True, but we are discussing the future of CSS. Overcomplexity isn't beneficial for anyone.

Thread Thread
 
xwero profile image
david duymelinck

I'm not a frontend developer, so I needed to look up why oklab (oklch) is superior over RGB. And what I understand is that oklab provides a lot more finetuning on the way the colors look. So the complexity is there because there are more possibilities.
If I take that to the real world, it is possible to draw with one pencil. But you can use multiple pencils with different hardness and colors that can make the drawing better.

Some people see it as overly complex to have more options and others find the current options limiting. Evolving is always a struggle. I rather evolve than stand still.
Maybe in the future there will be a more intuitive way to do the finetuning, but with what I can see from the documentation. It looks like it is a very powerful function.

The time when websafe colors where a thing is long behind us. And it made both designers and frontend developers more creative.

Collapse
 
patrick_davolla profile image
Patrick Farrell

CSS, according to hardcore developers, is the red-headed step child in the basement. I love CSS and champion it whenever I can. This is a great post and I hope it is read by everyone.

Collapse
 
louis7 profile image
Louis Liu

For beginners, they don't need to learn CSS because AI can write cool CSS styles for them. A library like Tailwind is easier to learn, so why should they spend time on CSS?

For experienced developers like me, I don't want to spend time learning CSS either. Learning JavaScript frameworks like React is more important. Honestly, AI-generated CSS is not bad, and the visual effects are even better than what I can write. I just need to remove some effects I don't need and refactor the code to make it cleaner.

Maybe it will develop into a language that AI uses more proficiently than most humans.

Collapse
 
seanlindsay101 profile image
seanlindsay101

That said, what CSS tools do people recommend?