Below is the CSS script provided by the instagram.
Code: Select all
.filter-valencia {
-webkit-filter: sepia(.25) contrast(1.1) brightness(1.1);
filter: sepia(.25) contrast(1.1) brightness(1.1);
}
.filter-valencia::before {
background: rgba(230, 193, 61, .1);
content: "";
mix-blend-mode: lighten;
}
Code: Select all
// colorFilter
rgbColor = [255, 225, 80, .08];
var adj = rgbColor[3];
for (var i = 0; i < pix.length; i += 4) {
pix[i] -= (pix[i] - rgbColor[0]) * adj;
pix[i + 1] -= (pix[i + 1] - rgbColor[1]) * adj;
pix[i + 2] -= (pix[i + 2] - rgbColor[2]) * adj;
}
// saturation
adj = .1;
for (var i = 0; i < pix.length; i += 4) {
var r = pix[i],
g = pix[i + 1],
b = pix[i + 2];
var gray = .2989 * r + .587 * g + .114 * b;
pix[i] = -gray * adj + pix[i] * (1 + adj);
pix[i + 1] = -gray * adj + pix[i + 1] * (1 + adj);
pix[i + 2] = -gray * adj + pix[i + 2] * (1 + adj);
}
// contrast
adj = .05 * 255;
var factor = 259 * (adj + 255) / (255 * (259 - adj));
for (var i = 0; i < pix.length; i += 4) {
pix[i] = factor * (pix[i] - 128) + 128;
pix[i + 1] = factor * (pix[i + 1] - 128) + 128;
pix[i + 2] = factor * (pix[i + 2] - 128) + 128;
}