Ionic custom CSS for iOS vs Android style


Is there any CSS pre-build styles to replace Ionic default style which could fit with Android style on Android and iOS style on iOS?
Something like Ratchet for the CSS part of Ionic?

Ionic does some of this by default. For example, nav bars will have titles centered on iOS and left on Android, and for nav bar buttons if you use side=primary and side=secondary, the location changes based on the platform.

Tabs are on the bottom on iOS and at the top for Android by default.

Also scrolling is different based on the platform - iOS bounces, Android doesn’t.

Popovers also have platform-specific styles.

And I’m sure there are a few other little things.

1 Like


I thing that the documentation of the components should show the different styles just like Ratchet does it.
It’s a really good feature, maybe to be more explicit in the doc.

Yeah that would be helpful. The docs tend to tell more about the differences than show them, and the info on platform differences is with the individual components. It would be nice to have a page detailing the differences, and the ability to switch between iOS and Android previews in the docs. (@mhartington - docs idea here? or are we not seeing an existing page?).

1 Like