Diberikan nilai RGB, seperti 168, 0, 255, bagaimana cara membuat tint (membuatnya lebih terang) dan shades (membuatnya lebih gelap) pada warnanya?
Diberikan nilai RGB, seperti 168, 0, 255, bagaimana cara membuat tint (membuatnya lebih terang) dan shades (membuatnya lebih gelap) pada warnanya?
Jawaban:
Di antara beberapa opsi untuk shading dan tinting:
Untuk bayangan, kalikan setiap komponen dengan 1/4, 1/2, 3/4, dll., Dari nilai sebelumnya. Semakin kecil faktornya, semakin gelap bayangannya.
Untuk tint, hitung (255 - nilai sebelumnya), kalikan dengan 1/4, 1/2, 3/4, dll. (Semakin besar faktornya, semakin terang warnanya), dan tambahkan ke nilai sebelumnya (dengan asumsi masing-masing .component adalah bilangan bulat 8-bit).
Perhatikan bahwa manipulasi warna (seperti tints dan shading lainnya) harus dilakukan dalam RGB linier . Namun, warna RGB yang ditentukan dalam dokumen atau dikodekan dalam gambar dan video tidak cenderung dalam RGB linier, dalam hal ini yang disebut fungsi transfer terbalik perlu diterapkan ke setiap komponen warna RGB. Fungsi ini bervariasi dengan ruang warna RGB. Misalnya, dalam ruang warna sRGB (yang dapat diasumsikan jika ruang warna RGB tidak diketahui), fungsi ini secara kasar setara dengan menaikkan setiap komponen warna sRGB (mulai dari 0 hingga 1) menjadi pangkat 2,2. (Perhatikan bahwa "RGB linier" bukanlah ruang warna RGB.)
Lihat juga komentar Violet Giraffe tentang "koreksi gamma".
Bergantung pada Model Warna Anda, ada beberapa metode berbeda untuk membuat warna lebih gelap (berbayang) atau lebih terang (tinted):
RGB:
Untuk naungan:
newR = currentR * (1 - shade_factor)
newG = currentG * (1 - shade_factor)
newB = currentB * (1 - shade_factor)
Untuk mewarnai:
newR = currentR + (255 - currentR) * tint_factor
newG = currentG + (255 - currentG) * tint_factor
newB = currentB + (255 - currentB) * tint_factor
Secara lebih umum, warna yang dihasilkan dari pelapisan suatu warna RGB(currentR,currentG,currentB)dengan suatu warna RGBA(aR,aG,aB,alpha)adalah:
newR = currentR + (aR - currentR) * alpha
newG = currentG + (aG - currentG) * alpha
newB = currentB + (aB - currentB) * alpha
tempat (aR,aG,aB) = black = (0,0,0)untuk naungan, dan (aR,aG,aB) = white = (255,255,255)untuk pewarnaan
HSVatau HSB:
Value/ Brightnessatau tambahSaturationSaturationatau tambah Value/BrightnessHSL:
LightnessLightnessAda rumus untuk mengkonversi dari satu model warna ke yang lain. Sesuai pertanyaan awal Anda, jika Anda berada RGBdan ingin menggunakan HSVmodel untuk membuat bayangan misalnya, Anda dapat mengonversi ke HSV, melakukan bayangan, dan kembali ke RGB. Formula untuk mengonversi memang tidak sepele tapi bisa didapatkan di internet. Bergantung pada bahasa Anda, ini mungkin juga tersedia sebagai fungsi inti:
RGB memiliki keuntungan karena sangat mudah diterapkan, tetapi:
HSVatau HSBagak rumit karena Anda perlu bermain-main dengan dua parameter untuk mendapatkan apa yang Anda inginkan ( Saturation& Value/ Brightness)HSL adalah yang terbaik dari sudut pandang saya:
50% berarti Hue yang tidak berubah>50% berarti Hue lebih terang (tint)<50% berarti Hue lebih gelap (teduh)Lightnessbagiannya)Saat ini saya bereksperimen dengan kanvas dan piksel ... Saya menemukan logika ini bekerja lebih baik untuk saya.
tambahkan untuk mengimbangi nilai 'tint'
var grey = (r + g + b) / 3;
var grey2 = (new_r + new_g + new_b) / 3;
var dr = grey - grey2 * 1;
var dg = grey - grey2 * 1
var db = grey - grey2 * 1;
tint_r = new_r + dr;
tint_g = new_g + dg;
tint_b = new_b _ db;
atau semacam itu...
rs = r * 0.25,gs = g * 0.25,bs = b * 0.25(yaitu warna gelap yang cukup); Tint (rt, gt, bt):rt = r + (0.25 * (255 - r)),gt = g + (0.25 * (255 - g)),bt = b + (0.25 * (255 - b))(yaitu warna cukup ringan). Saya melakukannya sebagai bagian dari rangkaian keren yang menciptakan banyak corak dan berhasil dengan baik. Semoga membantu. Terima kasih Peter.