Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
Fake color overlay on an image with gradients
// Use @include colorize('image.png', red, 0.5)
@mixin colorize($image, $color, $opacity) {
background: $color;
$color: transparentize($color, 1 - $opacity);
background: -webkit-linear-gradient(left, $color, $color), url($image);
background: -moz-linear-gradient(left, $color, $color), url($image);
background: -ms-linear-gradient(left, $color, $color), url($image);
background: -o-linear-gradient(left, $color, $color), url($image);
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.