Designing and theming is one of the most important parts of the Web Development process. In theory, a web application is always created to solve a specific set of problems for the end-users, and as long as the application fulfills its primary goal, it will always attract the users which require that solution.
A good thing to remember is that a beautiful and appealing website with a great user experience will always attract even more customers since the application will be easier to use. Along with all the UX improvements, this is also where the brand’s specific visual identity comes into play.
Most of the time our job while developing is to follow one certain visual identity pattern and create a lovely application from that.
But what happens when we want our application to have one visual identity for some users, and a different one for others?
What happens if our application needs to support a large range of different visual identities?
In this blog, we will try to provide some insight using a sample solution that showcases an example project which utilizes Angular in an attempt to generate a wide range of different theme variations using only a couple of colors.
The end result is a simple website where we could play with a lot of theme options and find the best look for our application. It consists only of one page where we showcase the capabilities that are easily applicable to multiple pages and a lot of components, all of which could be themeable.
The full code for this example can be found on Github.
In order to start solving an issue, we need to be presented with certain problems. In this example, we try to tackle the following problems:
If some of the requirements mentioned above are something that you can relate to, then you could find some ideas about a potential solution to the problem.
Challenge #1: Fetch theming data from server
If we’ve analyzed the issues above, we surely noticed that we need to fetch the theming information from a database, so this mean