I have a custom Css applied to the whole sharePoint sites, but what I want is that the sharePoint Icons was highlighted should come in white.

I have not used themes in SharePoint and have applied custom CSS using custom master page.

I have explored options to create custom themes and then apply in which SP theme engine generates the Sprite images.

But creating theme will be a big ask and hence we want to stick to custom css, but want to replace specific images to white.

Please suggest how this is possible.

Hi,

According to your description, my understanding is that you want to change the specific icon color.

I suggest you can use Jquery .css method to set the icon color , you can use SharePoint Designer to add Jquery code under the

PlaceHolderMain tag in the document library view page.

Here are some detailed code demo for your reference:

Jquery CSS method

How to set background color in jquery

Thanks

Best Regards

Hi Jerry,

Thanks for replying to this thread. I don't think using Jquery I will be able to change the image color of sharepoint 2013 icons.

SharePoint 2013 has a theme engine which creates/generates the files like CSS, images on the fly.Theme engine uses a composed look list to get the mapping of master page and SPColor files. 
If the background color in the SPColor file is set to black, then it automatically generates the sprite image in white color so that they stand out.

But as I'm trying to use is a custom CSS and have not used themes, I wanted to know if there are any other options to replace the OOB SharePoint 2013 image which by default comes in black color.

My requirement is to have a very customised look and feel for Client, where by the list webpart coloumn background will be in dark color, so the sharePoint icons should be in white.

Thanks,
Soumo

hi,

if you goto your images forlder 

C:\Program Files\Common Files\Microsoft Shared\Web Server Extensions\15\TEMPLATE\IMAGES

you will see spcommon.png file  you can edit it in paint and change icons color and save it back .

so now you will have this changed icon color but it will throught the all the sites that usng that hive foler .

if every site has the same change use this approach .

hi,

if you goto your images forlder 

C:\Program Files\Common Files\Microsoft Shared\Web Server Extensions\15\TEMPLATE\IMAGES

you will see spcommon.png file  you can edit it in paint and change icons color and save it back .

so now you will have this changed icon color but it will throught the all the sites that usng that hive foler .

if every site has the same change use this approach .

• Marked as answer by Jerry ZyMicrosoft contingent staff, Moderator 17 hours 58 minutes ago

I'm not sure if this is the recommended approach. I've managed to get this working by creating custom theme. In SharePoint 2013, you can create a custom SPColor file, your custom master page and SPFont file. Then using this a composed look is created. After this is done, we created a custom style sheet where we identified the SharePoint OOB class and used the Recolor method of css to change the icon in spcommon.png. This file needs to be uploaded into the themable folder within styles library and published. Once this is done, then go to change look and apply the new theme. When this is done SharePoint 2013 theme engine creates the css and images and even considers the custom styles placed in themable folder and generates them in the themed folder under styles library. This is what is referred on run time by SharePoint then.

This way we managed not to touch the OOB image of SharePoint and even recreate the sprite image from scratch. 

This is the way as per my understanding to recolor the sharepoint icons.

Thanks all for posting all your views here.