Monday, April 21, 2014

JavaScript Brightness

/**
 * http://www.sitepoint.com/javascript-generate-lighter-darker-color/
 */

function colorLuminance(hex, lum) {
    // Validate hex string
    hex = String(hex).replace(/[^0-9a-f]/gi, "");
    if (hex.length < 6) {
        hex = hex.replace(/(.)/g, '$1$1');
    }
    lum = lum || 0;
    // Convert to decimal and change luminosity
    var rgb = '#', c;
    for (var i = 0; i < 3; ++i) {
        c = parseInt(hex.substr(i * 2, 2), 16);
        c = Math.round(Math.min(Math.max(0, c + (c * lum)), 255)).toString(16);
        rgb += ('00' + c).substr(c.length);
    }
    return rgb;
}

Penggunaan

colorLuminance('#aabbaa', 0.5); // lighter
colorLuminance('#aabbaa', -0.5); // darker

Lihat Demo

Labels: ,

7 Comments:

At Tuesday, April 22, 2014 at 6:21:00 AM GMT+7, Blogger IRIL SAGITA said...

Mantab nih, pas lg nyari kak.

 
At Tuesday, April 22, 2014 at 8:16:00 AM GMT+7, Blogger Ana Sriwahyuni said...

bisa dijadikan sebagai acuan dalam mengelola warna-warna yang diinginkan ini mas, makasih ya..

 
At Tuesday, April 22, 2014 at 6:42:00 PM GMT+7, Anonymous Anonymous said...

Turut menyimak aja mas. Kurang faham akan Js.
Ada page atau label untuk pemula nggak mas, saya suka coding juga sebenarnya, hanya saja tidak ada bimbingan dan tak cukup waktu untuk memulai.

Terima kasih sudah berbagi "Javascript Brigthness".
Salam. DTE.

 
At Wednesday, April 23, 2014 at 10:23:00 AM GMT+7, Blogger Taufik Nurrohman said...

Ke utara sedikit pak, terus belok kiri.

[img]http://3.bp.blogspot.com/-1uVrAYRVXkQ/U1cx9_XmBoI/AAAAAAAAIiQ/Vt7FLfyE46c/s1600/2014-04-23_101709.png[/img]

 
At Tuesday, May 6, 2014 at 9:11:00 AM GMT+7, Blogger Rdk said...

saya suka sama mas taufik,,, minta otaknya dikit donk mas :D

 
At Tuesday, May 6, 2014 at 1:03:00 PM GMT+7, Blogger Unknown said...

iya, aku juga minta donk mas :D

 
At Tuesday, May 6, 2014 at 7:57:00 PM GMT+7, Blogger Taufik Nurrohman said...

Maaf, ini limited edition :p

 

Post a Comment

<< Home