So, I know how to change the theme in SharePoint 2010, I also know how to colors on a calendar. What I would like to know, is there a way to change the calendar colors WITHOUT changing the theme?

I work at the United States Military Academy, and the overall theme on all pages is Black and Gold. I want to "add" or "change" the calendar colors for my unit without formatting all the sites....

I think that there is a limit of 10 colors, I also think there should be a way of formatting through designer, but I am new to SharePoint, and this is confusing. Any thoughts?


one of the most simple (and documented) ways to brand a site globally,

  1. create a css file in \style library (sharepoint designer)
  2. inspect the css and copy the css classes to override the styles, into your custom file
  3. use AlternateCSSUrl property to associate the css file with the site (Site Settings > Master page) (publishing only)

you can set this up on an individual site, or, alternatively, keep the css file, but reference it though a content editor webpart on a specific page. that way you can update the styling by updating the css file, as opposed to editing the page, check in, check out, save, etc.

| improve this answer | |
  • Do you have a specific website I should look at for detailed information on how to accomplish this? You answer makes sense, but when I look in sharepoint designer, there are a ton of pages and areas for me to mess up!! – pepsijoe Jan 16 '18 at 12:45
  • see here for example: sharepoint.stackexchange.com/questions/75480/… style library may appear only in the root site so either create the css file there, or under _catalogs\masterpage as one of the replies in that post shows – Tiago Duarte Jan 16 '18 at 12:54
  • I should have been a little more specific... Where can I find a page to show me how to write the actual .css? What I really want to do is change the individual colors of items on the calendar. I understand that there are elements on the page (such as "body" or "background") but I simply want to change colors based on the event. I don't mean to make this difficult, and I apologize. Thank you for the help thus far. – pepsijoe Jan 16 '18 at 13:07
  • you'll have to learn how pressing F12 brings up the console. you inspect the DOM (Elements tab in chrome) and it will show you the applied styles. you can change in place and see the result. then copy into your own css file and refresh the page to see the changes take place. repeat until happy with results. if you want to change, let's say 2 elements (events, etc) that share the same CSS classes, that is going to be tricky. hope this makes sense. let me know – Tiago Duarte Jan 16 '18 at 13:11

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.