Styling a generic ionic application - where to start?

Hi there,

It’s been a while now since I started developping on ionic, and as I see that almost all the functionalities are implemented in my app (some inventory/intervention management app for department of transportation in USA), I hate how generic it looks and feel. I can see some superb apps being developped in this topic, and am wondering where I should start to make my app as pretty as others : CSS ? SASS ?

I’ve been a software developper for years, but more focused on ugly stuff i.e. internal webform/winform/wpf apps, never really had to make something pretty… so learning is not a problem. I just need to know where to start.

Thanks for your advices!

I would definitely use sass. That way you can easily extend or reuse alot of ionic variables/mixins from the ionic library.

Take a look at http://ionicframework.com/docs/cli/sass.html

thanks, it was not easy for me to define the starting point for such a thing as styling. I know the use of SASS, but was not sure of where to go, and this page seems to contain everything I need.

1 Like

As others have said before me, you can use SASS. If you put in the effort in a decent structure, it can accelerate the styling of future projects.

I’ve spent enough time with the styling of ionic apps that I’m focusing on teaching others via weekly tutorials. The resource site is currently in progress but in the meantime if you need to deploy for a project and time is short on design I’ve also developed premium themes for ionic:

First Theme http://audacitus.com/gemionic
Second Theme (Work in progress - subscribe for updates) http://audacitus.com/rubyonic

I hope this helps.

1 Like

I’ll check it out soon. Sounds great for some extra inspiration, thank you!

One of the coolest parts about Ionic is that it’s HTML and CSS! My big app I’ve been working on requires a lot of custom components, or entirely custom elements for lists and buttons, so don’t be afraid to expand on what they have too. It’s just html and css and there are so many tutorials online about user interface and cool tricks to use.

1 Like