: Changing color scheme of calendar icons? Here's the image I'm working with: I'm wondering if it's possible to automatically change all the images to using a color scheme close to #489fdc. I've

@Nimeshi706

Since this is tagged as web-design:

Although your purpose for these calendar images is not clear, in order to create this in the most dynamic way, I'd recommend using HTML's little know <time> element (which is supported back to IE9) and CSS as opposed to creating a bunch of variation images because it's much easier to update.

Here's a basic structure you could use (pulled from Craig Buckler's article on the subject), you could just replace the text with what you need.

<time datetime="2014-09-20" class="icon">
<em>Saturday</em>
<strong>September</strong>
<span>20</span>
</time>


With some added styling, you can create something quite similar to what you're wanting. You could even create the rings on top by using pseudo elements.

If you use a preprocessor like SCSS, you could make changing the color scheme (even with gradients) could be as simple as changing one variable.

Vote Up Vote Down

@Cofer715

A quick and dirty way in photoshop would be to open the image in photoshop, go to image/adjustments/hue&saturation, select colorize and then tune the Hue and Saturation sliders. Because you are using a png, you might have to clip out the parts you do not want to be effected and leave those parts a layer above the copy of the image with the parts you need to effect with color.

Vote Up Vote Down