What is Baseline 2023? And should you use it?

Baseline 2023 is a definition that lets frontend web developers know when a CSS, JavaScript, or API feature is fully supported by modern browsers. The list of modern browsers includes Safari (macOS and iOS), Firefox (desktop and Android), Chrome (desktop and Android), and Edge (desktop). When a CSS feature is marked with a Baseline label, you can start using it or start using it when your company approves those new CSS features.

Based on the market you're in, it might be better to wait a few years so you can be sure that all your clients and visitors have updated their browsers to a more recent version and are no longer left out. They can then visit your site without any problems. When a CSS feature is supported for more than 30 months, the baseline feature gets the label that it's widely available, making it safe to use.

What are the major Baseline 2023 features?

I have listed a few of the major Baseline 2023 features below.

Container Queries:

This allows applying styles based on the size of a container element, offering more responsive layouts.

Subgrid:

Enables creating subgrids within a main grid layout, providing more granular control over element placement.

New Color Functions:

Functions like color() and color-mix() offer more flexibility and manipulation of colors in CSS.

CSS Has Selector:

The :has() selector allows targeting elements based on the presence of specific child elements.

Trigonometric Functions:

Functions like sin() and cos() became available for creating more complex animations and effects.

A complete list of the Baseline 2023 features can be found on web.dev.

Should you update your development guidelines with Baseline?

While I personally haven't used the baseline yet, I think it is a great idea for bigger companies. So there are some guidelines for writing CSS, JavaScript, or using APIs. I still believe that it is important to write your code in the same way and make clear to your developers which CSS features are safe to use or are still too new. When you add Baseline into your guidelines, it is clear to everyone that they may or may not use those CSS features, and once a year, you can update those guidelines to newer standards. When you don't do this, web developers may use some CSS features that can break your platform for users on older computers and make your company lose money.

If you ask me, you should update your guidelines to include Baseline.

Final word

As said earlier, I have not found a use for it yet. But I still believe it is a great addition to larger web companies because it makes it easier to set up guidelines and more. So everyone knows what CSS features they can use. When I have a change in the feature, I will introduce it and make sure it will be part of the guidelines.

未来は与えられるものではない。それは自ら掴むものだ。」— A future is not given to you. It is something you must take for yourself. - Nier Automata