foreign [Music] we'll be looking on one of the feature which got released into Utah okay and I'm pretty fond of that that is the theme Builder so whenever you start with a project any project okay which you are starting from the scratch what is the first and foremost thing what which client wants that's branding okay so whenever you start with a project The Branding is the most important thing if they want to change the color or too much that existing logos and all those things they want to change the logo on the service now instance they don't want to go with the service now logo the way you have on PDA installation so on right and this particular task was difficult in this particular point of time if you have done the team building you must be aware about that okay if you have not done that it's pretty good for you because you don't have to remember all those things out because you have theme Builder now in place so interested I will be looking how what is theme Builder and how we can use it out in in the Utah release disclaimer this is released in uttar so don't try to get all this configuration in the previous releases okay so let's get started so what is theme Builder first so consider how a UI interface okay UI ux of your service now PDI instance so you can see on the screen it has navy blue color as the header green color the buttons are off greenish type okay and destructive whatever red type and so on okay so all this color mapping you can call it as a theme for that particular instance and you must be knowing if you go over here okay and if you so you have the option to change the theme also right so that was a part okay that that we used to see right if you go to the preferences well it's not work okay preferences and if you go to themes so you can see we have two theme default and dark one right so these are the themes now let's see how we can create our theme so for that what you have to do first and the foremost thing is go to the plugins plugin and in plugins we have to install the theme Builder plugin first just to enable this functionality so once you sign into the same just search for theme Builder and you will be able to see this beautiful portal next stream experience right just install it out once you install it out just go back okay just you have to login and log out log out and login sorry my bad and then you have to just search for theme management or you can simply in themes there is a model called theme management under and everything is coming in now experience framework okay and we can see a beautiful interface called theme Builder so just click on the same and now it will create an interface for you so let's just wait for the same I'm also using it for the first time so it loaded and here this is a brand new page okay where you can see option to create a theme and also you can get the explanation on the same how you can do the stuff out okay how you can set up the themes and so on okay so we'll not go with the same okay we will just get started so I will just click on create theme and it asks you need some prerequisite you need a logo if you want to change and you need a brand palette okay so let's let's do one thing let's search for some color palette so I will just go color right X and let's select some this one some funky one so let's go with this color palette okay and now we'll come over here and let's cook continue now we have to give the name for this theme so we will give demo team okay and this is and we'll go next now it's asking what's your brand primary color so yeah the answer is pretty simple for us this one so we will copy this out copy this hex will go back to the same you have to just click on the same and you will get the pop-up for the hacks so we will just fill it out with the findings so this is what we want to connection it's not coming okay something wrong I did let's let's try it one more time click on the same this is a color I'll go to back tab I'll give this color out and we got it so this is a primer color now it's asking what's the secondary color we'll go back over there I'll just minimize the screen will go one step back and we will take this pink one as the secondary color let's play around it right so I'll go over here again it's asking for the secondary color so we'll click again on the same we'll paste the color apply and that's done the secondary color now what let's see what it's asking us what is the neutral color so let's change this out also right let's have fun so I will make this cut color over here as a neutral color click on this we'll paste it out apply next now do you want any additional color yes why we want additional color because we have two colors in a still remaining right so this purple color also we will give you can also add one more color so let's give that also why please left one one color only so let's give this color also now we'll go to next now it's asking full a logo okay which will replace the service now logo and it has some Dimension I'm not pretty sure whether I have the file for the same let's take this 515 KV 512 let's try to okay the dimension I pick I have a thumbnail also for this here so it's also done next so we have changed the logo also pretty easy right now it's asking which font you would like to use so let's see how exactly cab been NATO opens as always the fans of fan of openshan so we'll select that next now is I almost done to the corners let's go with the more rounded Corner okay next and we'll click on create theme so it will now create theme for us I don't think it's looking that good okay but we have a two we will just kept it out okay for instance and this is how it should look okay so here you can see we they have given a beautiful panel over here one two three or five so you can simply navigate and see how your color theme will look on different areas of service now instance so you can see this is how it will look for now wow this looks good okay and then based on based on this you can change if you want to change you can change also right and on the left hand side you can see the theme name is demo theme the description this is a color palette if you want to change it out you can change it out from here but will not change we'll stick to that the font family if you want to change you can change you can do all kind of customization over here then we have this color palette if you select on this you can do a lot of configuration over here like for example background the background is white right now right if you are not writing liking the white background so the AI creates the shades on the selected color so I will select this one as a primary one okay let's see what effects it has oh wow this looks nice okay in the similar way you can change a lot of things border you can change let's make a border green apply I'm just playing around right and so on you can keep on doing it's it's pretty fun activity okay then you have image if you want to change the image font shapes okay you can do all the things out also you have a tab over here called experience preview so what it will do if you click on it so it will it will Pub it will put your theme on some dummy uh portal okay and it will show you how exactly it will look so this is not your actual portal but it's just a dummy portal I'm pretty impressed at this particular point of time it looks pretty nice so once this is done you are you can simply apply the theme from here so if I go and apply the thing the theme applied you are using demo theme as your team let's see if if that's that that's really the thing so I'll just sort of pressure out and you can see everything got changed right if I if I click on and I'm really liking it out so this is how it looks okay I'm pretty impressed but you can see the service now logo is still the same right why didn't change because you haven't override that particular thing out so if you want to override the logo what you have to do you have to just override one property so what you can do you can simply go to fifth underscore properties Dot Plus and we have a property called RDU wipe Polaris theme Builder override logo pretty big name right so let's search if we have that property if not we don't have that property so let's create one so I will click on new I'll give it a name whatever it was there I will just go to home just to check there was no space and will just set the value let's make it string only or Draw false okay let's make it profile and we have to just make it true okay I'll receive this out and if I refresh okay so you can see the logo over chain now isn't it amazing so this is all for today's tutorial interest rate we have seen how we can utilize the new feature which came into uttar release which is theme Builder and using that theme buildup feature how we can create the entire theme of the platform okay within 10 minutes so this is all for today's video hope you like this video If you want to get notified with future updates or future videos please subscribe to my channel okay till then stay safe stay happy and have a nice day ahead thank you