Get readable CSS Classes in Emotion Component/React

So you are working with styled components or Emotion Component and you are getting a bit frustrated with the classNames that are generated.

then you have found the right article and the salvation for you ;)

I'm using Emotion so off course you need to install that and also I “was” using @emotion/styled syntax.

what you need to do now is really easy and only 2 steps:

1. change all @emotion/styled imports within your components to instead import @emotion/styled/macro.