When CSS debuted in 1996, the premise was that content should be divorced from style, allowing the author to concentrate on the former, and the end-user (reader) able to tweak the latter to taste. Comic Sans became popular not too soon afterwards, surely related, perhaps the first real indication that this was in fact a major mistake.
By offering a locally scoped alternative to globally scoped traditional CSS (something that CSS Modules also give us), we can do away with many of the naming conventions (BEM, SMACSS etc) used to combat the problems caused by global scoping, such as the accidental overriding of styles. This results in a significantly simplified developer experience, being able to ensure that individual changes do not have unexpected flow-on effects.
This perhaps explains why Emotion, despite being relatively recent addition, has rapidly picked up stars on github, offering the option of both object and css string approaches, and wrapper around it’s core functionality with a Styled Component-like feel should you wish to use it use it over the primary ‘css’ function.
Given this flexibility, if you are looking to give CSS in JS a go, Emotion would probably be a good place to start in 2018, allowing you to decide for yourself which approach to take.