I really like these atomic/functional css libraries with any sort of frontend framework or templating system that leverages components.
Personally, I have been using Tachyons with React for the past couple months, and it's been a blast. Compared to writing html templates with Emmet and css with Sass, I feel as if I am more productive and like I can reuse more components.
I've also found Tachyons & React to be an amazing combination. The only trouble I've had is extracting common CSS class strings into tweakable components, e.g. a <Button> whose background color you can easily override, or a <Header> with tweakable font weight.
I wrote a tiny (1kb) library to make this easier. For anyone working with React and functional CSS, I hope it's helpful:
Seems like an interesting library! I also encountered this issue, but I ended up just passing in colors/borders/spacing as props. I will have to see how that holds up for complicated UIs.
Thanks! I started by just passing props too, and I could see that approach working forever. I just got tired of having to always specify <Button bg="blue" border="ba1" />, when 90% of the buttons in the app were blue with a border.
Personally, I have been using Tachyons with React for the past couple months, and it's been a blast. Compared to writing html templates with Emmet and css with Sass, I feel as if I am more productive and like I can reuse more components.
It's worth a try if it interests you!