3rd party theming and using other css frameworks in Ionic 4


I’m in need of setting up a theme like system like System-UI in my Ionic 4 React project so that I can have a common language with my designer but I’m not sure how to go about it. I could probably define it using Custum CSS Variables in my theme.css and just use it but it would be nice to see an example or best practice approach. The goal is to limit our design choices to limited options for spacing, font sizing, scales and etc. to make our workflow more straight forward and structured. Any hints?

Also I have been looking at 3rd party css frameworks like Tachyon, Styled Components, Tailwind and Team UI and they look interesting for giving better structure to app styling, providing css-in-js to avoid cascading issues and other conveniences like Utility first approach but I’m not sure how to mix and match it with Ionic own CSS Utilities and responsive support. Does anyone have any experience?

My biggest need right now is having a predefined theme (design system) structure with predefined options to be able to frame myself and my designer to agreed upon choices, like System UI mentioned above. Anything else would be cherry on top but I would appreciate any hints. Thanks