"The State of CSS 2025" 요약 정리

okorion·2025년 9월 23일

CSS frontend

📝 Document 요약 및 번역

목록 보기

15/90

Introduction (소개)

올해의 톤 & 주제
CSS는 이제 단순한 스타일링 언어가 아니라 레이아웃·모션·접근성까지 포괄하는 현대적 툴킷으로 자리 잡았습니다. 특히 :has(), 컨테이너 쿼리, 서브그리드가 일상적 실무 기능으로 정착했음을 강조합니다. 반면, 높이·오버플로·정렬 같은 오래된 난제와 브라우저 간 차이는 여전히 남아 있습니다.
새 CSS 로고
“CSS3” 숫자를 제거한 새로운 로고가 공개되며 세대교체의 신호로 해석됩니다.

T-shirt

올해 티셔츠
공식 티셔츠는 소프트 콘트라스트 색상을 사용했으며, 새 CSS 로고 테마를 반영했습니다.

Features (기능)

최다 사용 & 호감
:has()가 사용률 80.4%로 최다 사용, 호감도 51.5%로 가장 사랑받는 기능을 동시에 차지했습니다. 이어서 aspect-ratio(76.2%), intrinsic sizing keywords(75%)가 뒤를 이었습니다.
급성장 기능
text-wrap: pretty는 전년 대비 사용률 +17%로 가장 크게 성장했고, CSS Nesting과 light-dark()도 각각 +13%를 기록했습니다. 인지도 증가율 1위는 light-dark()(+23%).
프리프로세서 지형
Sass는 여전히 널리 쓰이지만 PostCSS 사용도 꾸준히 증가했습니다. 특히 PostCSS는 플러그인 생태계와 모던 기능 채택으로 강세를 보이고 있습니다.
요약
표준 CSS 기능이 빠르게 실무 주류가 되며 프리프로세서 의존도는 점차 감소 중입니다. 컨테이너 쿼리, 서브그리드, :has()는 실전 레벨로 안착했습니다.

Other Tools (주변 도구)

UI/스타일 프레임워크
Tailwind CSS는 여전히 강세를 유지하고 있으며, Bootstrap도 꾸준한 존재감을 보여줍니다. shadcn/ui는 인지도 과반, 사용 경험 16%, 재사용 의향 11%로 급부상했습니다.
번들러/메타프레임워크
Vite는 응답자의 66%가 사용했다고 답했으며, Next.js는 프론트엔드 메타프레임워크 중 재사용 의향 46%로 상위권을 기록했습니다.
CSS-in-JS
CSS-in-JS 사용률은 29%로, 현재 스타일링 전략은 유틸리티·원시 CSS·프레임워크·CSS-in-JS가 병존하는 다원화 양상을 보입니다.

CSS Usage (사용 행태·인식)

무엇을 CSS로 만들고 있나?
인터랙티브 웹앱이 정적 페이지를 앞서는 주요 사용 사례가 되었습니다.
Pain Points
높이·오버플로·정렬 같은 기본 레이아웃 문제가 여전히 불만의 상위권을 차지합니다. 브라우저 간 차이는 과거보다는 줄었지만 여전히 완전히 해소되지 않았습니다.
즐겨 찾는 신기능 & 게임 체인저
커뮤니티가 꼽은 즐겨 찾는 신기능과 게임 체인저로 :has(), 컨테이너 쿼리, 서브그리드가 반복적으로 언급됩니다. Baseline 표기와 Interop 프로젝트 덕분에 신기능 조기 채택에 대한 신뢰도가 높아졌다는 평가가 있습니다.
체감 변화 속도 & 만족도
웹 전반의 행복도는 정체되어 있지만 CSS 만족도는 상승세를 보였습니다. 동시에 변화 속도에 대한 부담을 토로하는 목소리도 나왔습니다.

Resources (학습·커뮤니티 리소스)

비디오 크리에이터
Kevin Powell이 유튜브 CSS 카테고리에서 독보적 1위를 기록했습니다. Theo, The Primeagen, Fireship 등이 뒤를 이었으며, Syntax는 +5 랭크 상승했습니다.
인플루언서(개인)
Josh W. Comeau, Kevin Powell, Adam Argyle, Una Kravets, Ahmad Shadeed가 상위를 차지했습니다. (+중써니)
웹 플랫폼 자료
MDN(3,506명) → Can I Use(3,059명) → web.dev(1,640명) 순으로 많이 참조됐습니다.
기타 설문 참여
State of JavaScript, State of HTML, State of React, Stack Overflow, JetBrains Developer Ecosystem 순으로 참여가 많았습니다.

Demographics (응답자 분포)

응답자 규모: 총 5,506명
국가 TOP: 미국(683), 독일(337), 영국(239), 프랑스(233), 네덜란드(186)
평균 나이: 36.1세 (30–39세가 최다)
평균 경력: 13.4년 (5–14년 차가 다수)
회사 규모: 평균 337명 (101–1000명 규모 기업이 많음)
평균 연 소득: 약 79,433 USD
직함 분포: Frontend Developer, Developer, Software Engineer 순
성별: 남성 3,278명, 여성 432명, 논바이너리/GNC 98명
장애 상태(다중응답): 신경다양성(611), 정신건강(538), 시각(280), 없음(1,998)

Awards (올해의 어워드)

Most Used: :has() (80.4%)
Least Used: sibling-count() (1.5%)
Largest Awareness Increase: light-dark() (+23%)
Largest Usage Increase: text-wrap: pretty (+17%)
Most Loved: :has() (51.5%)
Most Hated: Trigonometric Functions (부정 9.1%)
Most Commented: Subgrid (167+ 코멘트)

Conclusion (결론)

CSS는 레이아웃·모션·접근성까지 아우르는 단계로 진화했습니다. Baseline과 Interop 같은 생태계 개선 덕분에 신기능 조기 채택 리스크는 낮아졌습니다. 만족도는 상승세지만, 레이아웃 기본 문제와 변화 속도에 대한 부담은 여전히 과제로 남아 있습니다. 2026년에는 “오래 기다린 기능들”이 본격적으로 현실화될 것이라는 긍정적인 전망을 내놓고 있습니다.

Metadata (설문 메타데이터)

언어 분포: 영어(4,305) 최다, 독어(218), 러시아어(210), 불어(203), 스페인어(159)
완료도: 평균 77%, 90–100% 완료자가 3,223명
기기/브라우저/OS: 데스크톱이 다수(2,729). 브라우저는 Chrome(2,095), Firefox(783), Safari(591). OS는 macOS(1,451), Windows(983)
참여 경로: Devographics(2,216), Kevin Powell(305), CSS-Tricks(242), Bluesky(202) 등