Amadea K. Nastiti


just an exquisite cat lady around

HSL dan RGB

Mendeskripsikan warna tentu dapat membingungkan. Bagaimana anda dapat mendeskripsikan warna coklat? Lebih gelap dari merah, atau lebih 'berlumpur' dari peach namun agak kemerahan, dan sedikit kekuningan? Karena itulah terdapat standard terms untuk membantu dalam mendeskripsikan dan mengorganisasikan warna. Kita tentunya sudah sangat familiar dengan color picker window yang dapat ditemukan pada hampir tiap software yang dapat mengolah sesuatu dengan warna. Apakah dengan mencoba warna background untuk slide PPT atau ingin mengubah warna bucket fill pada MS Paint, anda tidak akan melewatkan the color picker.

colors

color picker window

Disini terdapat tiga cara untuk memilih warna, yaitu dengan memilih shade warna dengan mouse, memasukkan nilai hex RGB atau mengubah nilai HSL atau Hue, Saturation and Luminosity (also known as Brightness). Kode warna yang sering digunakan antara lain mendeskripsikan skala warna dalam bilangan hexadesimal, yaitu dalam format #RRGGBB. Misal pada warna hitam memiliki kode #000000, merah #FF0000 hijau #00FF00 biru #0000FF dan putih #FFFFFF.

Hue

Hue

Hue merupakan warna atau tone spesifik. Namun bukan berarti hue merupakan nama lain dari warna, karena warna sendiri memiliki saturation dan brightness seperti hue. Hue merupakan corak warna atau pilihan warna yang meliputi spektrum warna pelangi seperti merah, kuning, hijau, dst. Hue seringkali direpresentasikan dalam bentuk lingkaran yang berisi warna-warna pelangi. Karena berbentuk lingkaran, hue memiliki nilai sebesar sudut lingkaran yaitu dari 0 sampai 360.

Saturation

Saturation

Saturation merupakan kejernihan atau intensitas dari warna. Intensitas yang dimaksud adalah intensitas hue dari abu-abu (grey). Pada saturation maksimum, sebuah warna dapat tidak mengandung abu-abu sama sekali. Pada saturasi minimum, sebuah warna dapat terdiri atas sebagian besar abu-abu. Warna grayscale (yang didapat dari percampuran warna-warna RGB dengan perbandingan 1:1:1) memiliki tingkat saturation yang paling rendah. Nilai saturation berkisar dari 0 sampai 100.

Luminosity atau Brightness

Luminosity merupakan banyaknya putih atau hitam yang dimiliki sebuah warna, atau menyatakan tingkat terang sebuah warna. Warna putih yang merupakan percampuran warna RGB dengan nilai maksimum memiliki luminosity paling tinggi, sedangkan warna hitam memiliki luminosity paling rendah. Nilai luminosity juga berkisar dari 0 sampai 100.


Ilustrasi di atas menunjukkan perbedaan pada saturation dan luminosity. Pada setting umum, pada awalnya ambil sebuah hue pada color wheel dan kemudian kurangi saturation sehingga warna tersebut makin lama makin abu-abu. Kemudian ambil warna yang memiliki saturasi lebih kecil, yang dapat dilihat dengan menambahkan putih atau hitam, yang akan memengaruhi brightness dari warna tersebut. Sehingga perbedaannya, mengurangi saturation mengubah warna menjadi bernuansa abu-abu, meningkatkan brightness mengubah hue menjadi lebih terang tanpa membuatnya abu-abu.

Perbandingan saturation dan brightness

Untuk mengkonversi dari mode RGB ke mode HSL, pertama hitung max sebagai nilai maksimum dari nilai red, green, blue, dan min sebagai nilai minimum dari nilai red, green, blue. Lalu gunakan rumus berikut:
rgb to hsl
Rumus di atas menghasilkan nilai lightness dan saturation dalam jangkauan [0,1]. Kalikan dahulu dengan 100 untuk memperoleh nilai dengan jangkauan [0,100]. Untuk konversi dari HSL ke RGB, periksa dulu nilai saturation. Jika saturation 0, artinya warna termasuk grayscale, sehingga nilai R, G, dan B sama dengan nilai lightness. Nilai hue tidak diperhitungkan pada warna grayscale. Jika saturation tidak 0, gunakan rumus berikut:
hsl to rgb
Rumus di atas menghasilkan nilai RGB dalam jangkauan [0,1]. Untuk jangkauan [0,255], kalikan dahulu dengan 255. Konversi RGB ke HSL dan sebaliknya menghasilkan bilangan real, sementara media bitmap bekerja pada bilangan integer diskrit, karena itu kita perlu melakukan pembulatan. Hal ini menyebabkan pemetaan RGB dan HSL pada media digital tidak bersifat satu ke satu. Jumlah kemungkinan mode RGB ada 256x256x256 = 16.777.216 warna, sedangkan mode HSL ada 360x100x100 warna. Jadi akan ada warna-warna yang jika dikonversikan hasilnya akan sama akibat pembulatan.

Sumber:
Evan. 2009. Studi Digital Watermarking Citra Bitmap dalam Mode Warna Hue Saturation Lightness. Institut Teknologi Bandung.
Boulton, Mark. 2010. A Practical Guide to Designing for the Web. UK: Five Simple Steps LLP.


1. Widia

pada : 22 June 2012

"Boleh gak klo image berupa data medis dikonversiin dr HSL ke RGB??alasanx jg y..
Makasi yak.."


2. amadea

pada : 22 June 2012

"hai widia :D
boleh sebenarnya, hanya saja seperti yang saya tuliskan di atas, range warna RGB lebih luas daripada HSL, sehingga ditakutkan dapat menimbulkan kerancuan dalam warna :) apalagi data medis krusial kaan :D menyangkut diagnosis penyakit gitu :O
terima kasih pertanyaannya :D"


Tinggalkan Komentar

Nama :
E-mail :
Web : tanpa http://
Komentar :
Verification Code :   ">