Informe State of CSS 2021

• Encuesta a 8,714 personas de todo el mundo

• Adopción de nuevas funciones de CSS

→ Layout

⇨ CSS Grid : usado por el 83% (>2020 73%)

⇨ Subgrid : usado por el 12.7% (>2020 6.1%)

⇨ Flexbox : 98.7%

⇨ CSS Multi-column : 38.8% (>33.5%)

⇨ CSS Writing Modes : 15.4%

⇨ aspect-ratio : 37.1% (>22.4%)

→ Formas y gráficos

⇨ object-fit : 69.2% (>60.5%)

⇨ clip-path : 56% (>49.1%)

→ Interacciones

⇨ CSS Scroll Snap : 30% (>21.1%)

⇨ pointer-events : 70.5%

→ Tipografía

⇨ font-variant 20% / initial-letter 28.4% van en descenso

⇨ line-clamp : 29.5% (>20.3%)

→ Accesibilidad

⇨ prefers-reduced-motion : 26.7% (>15.8%)

⇨ prefers-color-scheme : 28.6% (>18.8%)

→ Otros

⇨ CSS Variables : 84.4% (>74.7%)

⇨ @supports : 46% (>40.6%)

⇨ CSS Containment : 9.6% (>6.4%)

⇨ will-change : 33.5% (~28.8%)

⇨ CSS Comparison Functions min(), max(), clamp(): 62.5% (>47%)

• Tecnologías preferidas

→ Pre/postprocesadores : PostCSS 91% > SaSS 84% > Stylus 35% > Less 34% > Assembler CSS 26% (nuevo ingreso)

⇨ Otras : Styled Components, Tailwind CSS, CSS-in-JS..

→ Frameworks CSS : Tailwind 78% > PureCSS 70% > Ant Design 56% > Bulma 54% > Semantic UI 47%

→ CSS-in-JS : vanilla-extract 87% > CSS Modules 86% > Windi CSS 84% > Styled Components 77% > Stitches 76%

• Otras herramientas muy usadas

→ Prettier , Autoprefixter, Stylelint, PurgeCSS, cssnano

→ Navegadores : Chrome 67.4% > Firefox 46.8% > Safari 23.6 % > Safari iOS 16.8% > Edge 16.5% > Chrome Android 13.6% > Brave 8.8%

Blogs más leídos : CSS-Tricks, Smashing magazine, dev.to, Medium

Sitios más consultados : Stack Overflow, MDN, W3Schools

Podcasts más escuchados : Syntax, Shop Talk Show, The CSS Podcast

Lo mejor del año

• Función más adoptada : CSS Comparison Functions

• Tecnología más satisfactoria : PostCSS

• Tecnología que más interés genera : CSS Modules

Información sobre las personas encuestadas

• Usuarios de inglés 72%, español 5.5%, ruso 5.3%

• Edad : 24~34 37.8% > 35~44 21.9% > 18~24 7.8% > 45-54 5%

• Experiencia : 5~10 años 22.3% , 10~20 años 22.3% > 2~5 años 16.6% > más de 20 años 7%

• Tamaño de la empresa : 100~1000 personas 17.1% > más de 1000 personas 12.4% > 20~50 personas 10.1% > 50~100 personas > 8.5%

• Salario anual : $50~100K 22.7% > $30~50K 14.7% > $100K~$200K 13.6% > $10K~$30K 11.2% > más de $200K 1.9%

• Género : hombres 65.4%, mujeres 8.3%

[xguru]

Informe State of CSS 2020 https://es.news.hada.io/topic?id=3304