To elaborate on this just a tiny bit, you can use tachyons-js[0] by the amazing jongold to automate even more of this: import tachyons from 'tachyons-js';

To elaborate on this just a tiny bit, you can use tachyons-js[0] by the amazing jongold to automate even more of this: import tachyons from 'tachyons-js'; const tachyonsHelperFunc(props) => Object.keys(props).map(prop => tachyons[prop]) const MyTachyonsComp = styled.div`${tachyonsHelperFunc}`; This way, MyTachyonsComp can now has all the benefits of styled-components (easy theming and overriding, power of JS for styling, ReactNative, nesting,…) while also being able to use tachyons really easily: <MyTachyonsComp ma2 ph2 bb /> In fact, you could probably even wrap the above helper to make it really easy to use: const styledTachyonsComponent = (...args) = styled(..args)`${tachyonsHelperFunction}`; Now you can created styled-tachyons-components really easily: const MyTachyonsStyledDiv = styledTachyonsComponent('div'); :tada: Note: I just coded this in this comment, might be some typos in there. [0]: https://github.com/jongold/tachyons-js https://github.com/jongold/tachyons-js