Plugin jQuery converti culoarea css în tonuri de gri?

Am căutat o metodă de conversie a întregii foi de stil CSS din valorile culorilor la valorile respective ale tonurilor de gri. Cu toate acestea, nu am reușit să găsesc o modalitate bună (în afară de deschiderea Photoshop-ului și de a face acest lucru cu greu).

Există o metodă de a face acest lucru și cineva știe dacă există un script jQuery care ar putea face acest lucru?

Note: This is not a question about converting color images to grayscale images, this is about converting a complete stylesheet to grayscale.

2
Acest lucru ar putea fi de ajutor, deși nu l-am folosit eu însumi. james.padolsey.com/demos/grayscale
adăugat autor Seabass, sursa

1 răspunsuri

Iată o funcție Javascript care va lua valori RGB și va reveni la valorile RGB desaturate.

function desaturate(r, g, b) {
    var intensity = 0.3 * r + 0.59 * g + 0.11 * b;
    var k = 1;
    r = Math.floor(intensity * k + r * (1 - k));
    g = Math.floor(intensity * k + g * (1 - k));
    b = Math.floor(intensity * k + b * (1 - k));
    return [r, g, b];
}

Și dacă vroiai să desaturați un anumit element într-o singură lovitură greșită, ați putea face ceva de genul:

function rgb_to_string(r, g, b) {
    return 'rgb(' + r + ', ' + g + ', ' + b + ')';
}

function desaturate_element(selector) {
    var fg = $(selector).css('color').match(/\d+/g);
    var bg = $(selector).css('background-color').match(/\d+/g);
    $(selector).css('color', desaturate(fg[0], fg[1], fg[2]));
    $(selector).css('background-color', desaturate(bg[0], bg[1], bg[2]));
}

Vedeți acest lucru în acțiune în acest JSFiddle . Acești multiplicatori de desaturare provin din acest thread .

Un alt lucru, valoarea k este cât de mult doriți să desaturați. 1 va desatura complet, iar 0 nu va desatura deloc.

6
adăugat