I am trying to change the color of the Share and Edit buttons in the top right corner of my SharePoint 2013 site. I was able to change the text color but I am unable to change the buttons next to Share and Edit, as well as the focus content button, any help would be greatly appreciated.

I changed the text color with the following CSS class:


You should use jQuery to JavaScript to change the icon. HTML is rendered as follows for Share Button

<span style="height:16px;width:16px;position:relative;display:inline-block;overflow:hidden;" class="s4-clust ms-promotedActionButton-icon">
    <img src="/_layouts/15/images/spcommon.png?rev=38" alt="Share" style="position: absolute; left: -200px; top: -48px;">

So to change the button. You can use following JavaScript

   $('.ms-promotedActionButton-icon').html('<img src="NEWIMAGEPATH" alt="Share">'); 

You can Update Default SharePoint 2013 Icon Colors with SharePoint Color Palette Tool, it's very easy.

This link is going to look at updating the out-of-the-box SharePoint 2013 icons. This comes in to play if you are creating a branded site.



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.