Select Page

Why shouldn’t we be fans of CSS? It’ constantly revolutionizes itself while trying to strive for its renowned form of simplicity. The end result is the creation of browser functionality that is arguably above and beyond what can be created with just JavaScript. Let’s examine some recent CSS enhancements and insights in the way i can be used. Some examples include blurred borders, setting a dark/ light mode switch (with a little help from JavaScript) and more.

CSS Features That Are Changing Web Design

The design landscape has changed a lot in recent years. We’re equipped with new and powerful tools — CSS custom properties, CSS shapes and CSS writing-mode, blurred borders in CSS, and sophisticated partitioning with CSS Grid – to name a few.

What is sophisticated partitioning with CSS Grid?

In the article written by Rob Weychert, he experimented with CSS grid to create a Tinnitus Tracker. He designed the grid pattern and then he worked on the partitioning of the grid.

These grid patterns mainly have the following 3 objectives:

  • Maintain a (somewhat) consistent whitespace.
  • Give the appearance of randomness.
  • Don’t forget about prime numbers.

Also adding CSS Grid, partitioning and typography as a cherry on top altogether gives a different look to the website and reaches to a different level of advancement. We encourage readers to follow the above link to learn more about how this was accomplished.

Blurred Borders in CSS

If we want to target an element and just visually blur the border of it. There is no simple, built-in feature we can apply. But we can get it done with a little CSS trickery.

After giving a code this effect, one can enhance it with rounded corners, extend support so it works cross-browser, what the future will bring in this department and what other interesting results can get starting from the same idea!

This article has step by step code details to show how we can add the blurred effect to the CSS.

New CSS features

In the article written by Daniel Crisp is about exploring the most exciting new properties coming to CSS. These include:

  • Fixing layout problems
  • Exploring feature queries
  • Use ‘not’ for a cleaner outcome

We encourage readers to follow the above link to learn more. We also came across these resources which may help you better understand how CSS is being used currently.

Additional Resources:

For those who prefer videos:

Every day things change in web design and development. We hope you are excited about these new approaches. CSS has certainly exceeded expectations of what was once considered achievable.

We hope you found these resources and overview useful. We always look forward to your comments and feedback (whether you are a member or not).