DEV Community

Discussion on: CSS-in-JS: What happened to readability?

jfbrennan profile image
Jordan Brennan • Edited on

Same. I saw BEM back when and thought, "Nooope." I prefer custom HTML tags with utility style classes:

<m-icon name="phone" class="pad-all-lg txt-lg"></m-icon>
Enter fullscreen mode Exit fullscreen mode

Like Custom Elements, but no JavaScript needed. Some of the styles are unique to the component (the custom m- tag), but more styles can be added with utility classes. A good balance between meaningful component API and flexible styling imo

FWIW I have a whole library