I don’t think you should use inline styles. There are some significant limitations to writing CSS that way (e.g. hover states, pseudo elements, etc…). Currently, the best solution I’ve found is CSSModules. You write your styles in regular CSS/SCSS/whatever and then merge them into your component. This way you get the benefits of writing in plain CSS but can also make styles component specific. Here is a very simple example of how it works https://github.com/ryanswapp/react-starter-template/tree/master/app/components/App/screens/Public/About
Essentially, any time you define a class as “className” you are referencing global CSS. When you define a class as “styleName” you are referencing the specific CSS that you’re merging into the component. I think this approach works great! Let me know if you have questions.