Change color & opacity for overlay shading when hovering over a post thumbnail


I am having trouble finding the CSS tag to alter the shading element of the the image when you hover over a post thumbnail, such as when you have your front page displaying posts… you hover over any post image and it fades yellow and displays the little chainlink icon…

I would like to change colour to grey (just the shading not the chain-link icon), and also decrease opacity as it tends to shade the background image too much

I know the colour changes when you customise your colours, but it is only this element I wish to change


I found it!!

I added the following code into my custom CSS and it works like a charm

.main-navigation li:hover, .post-navigation .nav-previous, .post-navigation .nav-next, .paging-navigation .nav-previous, .paging-navigation .nav-next, #today, .tagcloud a, .entry-thumb, .comment-respond input[type=“submit”], .cat-link, .search-submit {
background-color: rgba(0, 0, 0, 0.44);

Can see it here



Great! I’m glad it’s resolved and thank you for posting the solution! If you need help with anything else, please open a new topic.

Have a nice day!

Kind Regards,