Перейти до вмісту

State of CSS 2026

Використання CSS

Як ви використовуєте CSS.

Середовища тестування

Testing environments don't show much change compared to last year, with accessibility testing still not as common as it should be.
Для яких формфакторів чи у яких середовищах ви тестуєте?
Множинний вибір
0%
20%
40%
60%
80%
100%
01
Комп'ютери
3,774
02
Смартфони
2,510
03
Планшети
1,570
04
Комп'ютери лише з клавіатурою
1,300
05
Інструменти тестування (Axe, Lighthouse тощо)
1,054
06
Кнопкові телефони (фічефони)
1,030
07
Екранні зчитувальні пристрої
799
08
Версії для друку
477
09
Експорт PDF
306
10
Симулятор порушень зору (колірної сліпоти тощо)
262
0%
20%
40%
60%
80%
100%
% від тих, хто відповів на питання
3,781
77%
10
26%
Percentage of survey respondents who do not generate any CSS code using AI whatsoever.

CSS AI Code Generation

What's fascinating about this chart is that it looks completely different from a similar question asked in the State of AI or State of JS surveys. Comments on this question point to the fact that AI isn't great at CSS just yet. Time will tell if this is just a temporary limitation, or if we will one day have AI so powerful it's even able to fully grasp how CSS grid layouts work.

What proportion of the CSS code you produce is AI-generated?
0%
20%
40%
60%
80%
100%
1
0% ШІ
980
2
|
941
3
|
562
4
|
206
5
50%
322
6
|
157
7
|
312
8
|
188
9
100% ШІ
64
0%
20%
40%
60%
80%
100%
% від тих, хто відповів на питання
3,732
76%
28%
13%
10
💡
Науково доведено, що публікація цього опитування у Twitter, Facebook або відправлення на електронну адресу покращує ефективність вашого програмування на 15%.

Несумісність між браузерами

Anchor Positioning and the View Transition API are still the features respondents are refraining from using the most due to browser issues.

It's also interesting to note that Container size queries and Grid still show up in this chart, despite both having the Widely Available Baseline status.

Якими наявними функціями CSS ви не можете користуватися (або взагалі уникаєте) через недостатнє підтримування або відмінності між браузерами?
Довільна форма
Множинний вибір
0%
20%
40%
60%
80%
100%
01
02
+1
03
04
Проблеми Safari
+1
05
-3
06
07
08
+1
09
+2
10
0%
20%
40%
60%
80%
100%
% від тих, хто відповів на питання
632
13%
20
10

Відсутні функції

While we're still waiting for Mixins to make their way to CSS, browser vendors did address our pleas for Masonry Layout, last year's number two most-requested feature, in the form of the new display: grid-lanes syntax.
На вашу думку, яких функцій наразі взагалі не вистачає у CSS?
Довільна форма
Множинний вибір
0%
20%
40%
60%
80%
100%
1
Mixins
2
3
4
5
Media Query Variables
+5
6
Стилі для елементів форми
+2
7
Компонування masonry
-5
8
Інші відповіді
0%
20%
40%
60%
80%
100%
% від тих, хто відповів на питання
436
9%
10

Улюблена нова функція

:has() may still be as awesome as ever, but with many developers having already used it for over a year, it has lost its “best new feature” crown to Anchor Positioning, which gained 4 ranks to take the top spot.
Які ваші улюблені нові функції CSS ви почали використовувати цього року?
Довільна форма
Множинний вибір
0%
20%
40%
60%
80%
100%
01
+4
02
-1
03
-1
04
-1
05
-1
06
+4
07
+2
08
-1
09
-3
10
+3
0%
20%
40%
60%
80%
100%
% від тих, хто відповів на питання
913
19%
20
10

Темп змін

If you feel behind because you haven't used every single new CSS feature that's come out this year, don't. As this chart shows, most respondents are in in the middle of their feature adoption curves, having only learned about and tried out some of the features included in the survey.

Як добре ви зазвичай стежите за новими функціями CSS, як-от ті, що згадані в цьому опитуванні?
0%
20%
40%
60%
80%
100%
1
Не знали/не випробували більшість функцій
533
2
Дізналися про деякі функції, але не випробували їх
936
3
Дізналися про деякі функції та випробували їх
1,144
4
Дізналися про більшість функцій та випробували деякі з них
798
5
Дізналися про більшість функцій та випробували їх
290
0%
20%
40%
60%
80%
100%
% від тих, хто відповів на питання
3,701
76%
2.8
3
10

Задоволення вебтехнологіями

Respondents were relatively happy with the state of web technologies in general, maintaining a 3.8 average on a 5-point scale.
Наскільки ви задоволені станом вебтехнологій загалом?
1
2
3
4
5
2020
2021
2022
2023
2024
2025
2026
1
2
3
4
5
Середнє
3,737
76%
3.8
4
10

Стан CSS

On the other hand, happiness with CSS specifically shows a clear upwards trend in recent years, which happens to align nicely with the language's own rapid pace of improvement.
Наскільки ви задоволені станом CSS загалом?
1
2
3
4
5
2020
2021
2022
2023
2024
2025
2026
1
2
3
4
5
Середнє
3,747
76%
4
4
10

Рекомендовані джерела

Getting Started with CSS, v2
Jen Kramer
AnnieCannons

Getting Started with CSS, v2

Build a modern portfolio with CSS! Learn the foundations of layout and UI design as you explore semantic HTML markup, navigation styles, media queries, and CSS custom properties.
SVG Essentials & Animation, v2
Sarah Drasner
Google

SVG Essentials & Animation, v2

In this course, you'll learn to create immersive graphics and make them alive with animations!
Спонсорований вміст від наших партнерів. Детальніше.