التخطى إلى المحتوى

State of CSS 2024

Libraries & Tools

Despite the many capabilities unlocked by CSS's new features, developers still rely on tooling and libraries to support their workflow, at least for now.

CSS Frameworks

When it comes to CSS frameworks & UI libraries, Tailwind CSS continues to forge its own path far ahead of other, more traditional competitors.

0%
15%
30%
45%
60%
75%
1

3,657
2

2,623
3

646
4

614
5

446
6

362
7

286
8

272
9

260
10

0%
15%
30%
45%
60%
75%
% of question respondents
4,890
50%
Which CSS frameworks do you use?

CSS-in-JS

While some of CSS-in-JS's appeal might've been made obsolete by newer CSS features such as variables, recent innovations like typed styles and build-time compilation show that the space still has a lot to offer.

0%
12%
24%
37%
49%
61%
1

2,113
2

2,043
3

876
4

675
5

235
6

210
7

146
8

143
9

98
10

52
0%
12%
24%
37%
49%
61%
% of question respondents
3,458
36%
Which CSS-in-JS libraries do you use?
We asked members of the CSS community to share their “pick of the year”

My 2024 Pick: @property Being Widely Available

I would probably say the support of @property coming to Firefox this year, making this feature available-cross browser (since July) and unlocking a lot of cool stuff.
We asked members of the CSS community to share their “pick of the year”

Temani Afif

Creator of css-challenges.com

Pre-/Post-processors

Sass/SCSS is still the leader here, but it'll be interesting to see if its usage will remain stable now that many of its key features have been absorbed by CSS itself.

0%
13%
27%
40%
54%
67%
1

4,652
2

2,622
3

722
4

168
5

6

🚫 None

1,320
7

Other Answers

29
0%
13%
27%
40%
54%
67%
% of question respondents
6,897
71%
Which pre- or post-processors do you regularly use?

Utilities

There is no shortage of ways to format, minify, and otherwise tweak your CSS code to your liking.

0%
16%
31%
47%
62%
78%
1

5,175
2

2,691
3

2,199
4

854
5

729
6

604
7

416
8

9

27
10

25
11

🚫 None

742
12

Other Answers

65
0%
16%
31%
47%
62%
78%
% of question respondents
6,656
69%
Which utilities or tools do you regularly use?
We asked members of the CSS community to share their “pick of the year”

My 2024 Pick: Temani Afif

Temani is pushing the limits of what can be done with CSS. His experiments always blow my mind!
We asked members of the CSS community to share their “pick of the year”

Josh W. Comeau

Indie Hacker and Educator

Browsers

While the big four browsers dominate this chart, Arc is slowly creeping up the browser rankings, going from 7.8% to 12% usage year over year.

0%
15%
30%
45%
61%
76%
1

Chrome

5,473
2

Firefox

3,689
3

Safari

1,708
4

Edge

1,204
5

Safari iOS

1,107
6

Arc

831
7

Brave

779
8

Chrome Android

758
9

Chrome iOS

368
10

Firefox Android

321
0%
15%
30%
45%
61%
76%
% of question respondents
7,223
74%
Which browser(s) do you primarily work in during initial development?

Recommended Resources

Ultimate CSS Grid & Layout Techniques, v3
Jen Kramer

Ultimate CSS Grid & Layout Techniques, v3

You’ll learn to achieve complex layouts with minimal code. You'll also explore advanced techniques like container queries for adaptive components and subgrids for nested layouts.
Practical CSS Layouts
Jen Kramer
Freelance Instructor

Practical CSS Layouts

Starting with the basics of CSS and HTML, you'll progress through creating responsive designs for mobile, tablet, and desktop layouts.
شكرا لشركائنا لدعمنا! تعرف علي المزيد.