Openmrs general color(Resolved)

Hello everyone,

i will like to know which module and which files i can modify to change the general color of openmrs.

i would like to change the green color to blue.

thank you.

Could this be what you are looking for?

Thank you @jwnasambu.

i believe this page is just a guide. it doesn’t show me where to do the changes.

You can play around with the css page and see the outcome.

there is so many css files i don’t know where to start. i will see what i can do.

Thank you.

Hello @sharif Any idea? you have talked about it in a post. any guidance?

thank you

This may be of help Change Brand Color, let me know if you still need more guidance on this thanks

THANKS @sharif i will look into the login.css file but it will not help me to change the color of the other pages. in the uicommons module i have looked inside the styles folder but there is nothing there for changing the header and the widget colors

1 Like

If your ideal is to customise the color of the main bar as the screenshot is showing, u only change the login.css file .color in reference application module. FYI that theme bar will change the color only. which other parts are you intending to change the color?

yes i want to change the main bar color but like i show in the image above i also want to change the color of the widgets bar on the patient dashboard so it matches the main bar color. do you mean that if i change the color in login.css it will also affect the main bar or just the bar of the login page.

i have looked in the login.css of the reference application and i can’t find any reference to the bar color.

thank you

Hi @marafa

So login page is different from the other pages and modules it’s in a seprate jsp page. For other pages if you look at jsp pages you can find the below include.

For an example here

So you should work on this jsp page if you want to change the color or format. Change the css which are included in this page.

fyi :- some pages have their own css files as well. In some cases u have to go through them as well to modify page components. But here I think u have to modify only this page.


thank you @ayesh

i will have a look at it.

Yes just change the login.css btw you need to look into that file and only rename the color to your preference . thanks @ayesh for that option

1 Like

Hi @sharif i’m not sure i’m understanding. here is the login.css i have in reference app.

i don’t see anywhere i can change the color.

Am not sure if its ok to paste this but take a look after inspection ro

If your main aim is to change the color of the theme bar go to openmrs-referenceapplication\omod\src\main\webapp\resources\styles\referenceapplication.css. then change line 768 in the header section to the color of your the case of the screen shot its line 764 let us know for any progress or blocker

@marafa was that helpful, @ayesh do you have any other idea about how to overcome this

hello @sharif sorry for the late feedback. i have used your method and it worked perfectly. i have even managed to find where to change the color of the dashboard widgets headers in the same file . for those who are interested in changing the widgets colors just look for (.dashboard .info-header) in the same referenceapplication.css file. from there you can change the colors the different elements of the dashboard.

Thank you very much

1 Like

Congs Am glad that you have been helped :+1:

1 Like