Kailangan mo ba ng kulay para sa mockup, tsart, o blangkong canvas, ngunit napapagod ka na sa pagpili ng parehong mga pagpipilian? Ang libreng generator ng random na kulay na ito ay kumukuha ng mga kulay mula sa buong 24-bit na hanay na maaaring ipakita ng screen, at ipinapakita ang bawat kulay sa isang color swatch sa tabi ng code nito. Piliin kung ilang kulay ang kailangan sa field na “Bilang ng mga pipiliin”, mula 1 hanggang 50, lagyan ng check ang mga format na gusto mo, at pindutin ang “Bumuo ng resulta”. Magbubukas ang pahina na may isang kulay sa HEX, kaya isang click lang ang kailangan para sa unang resulta. Ang checkbox na “HEX Code” ay napili na sa simula, kasama ang “RGB Code” at “HSL Code” sa tabi nito, at maaaring i-on ang anumang kumbinasyon ng tatlo nang sabay-sabay. Ang gear button sa tabi ng “Bumuo ng resulta” ay nagbubukas ng panel na “Mga Advanced na Opsyon”, kung saan maaari kang maglimita ng mga kulay sa isang partikular na uri o hanay, alisin ang mga duplicate, at baguhin ang paraan ng pagsulat ng HEX.
Ang bawat kulay ay ginagawa sa iyong browser sa pamamagitan ng Web Crypto API (crypto.getRandomValues), na nagbibigay ng cryptographically strong random bytes mula sa sariling pinagkukunan ng randomness ng iyong system — hindi isang pseudo-random na function tulad ng Math.random(). Ang isang kulay sa screen ay may tatlong channel — pula, berde, at asul — bawat isa ay isang integer mula 0 hanggang 255, at ang isang random na byte ay mayroong eksakto 256 na posibleng value. Kaya ang bawat channel ay isang byte lang, walang paghahati at walang natirang labi, at walang shade na pinaboran ng anumang conversion step. Ginagawa nitong pantay-pantay ang tsansa ng lahat ng 16,777,216 na kulay na maaaring gawin ng pahina sa bawat pindutin ng “Bumuo ng resulta”. Ang mas makitid na hanay sa “Mga Advanced na Opsyon” ay pinapanatili ang garantiyang iyon sa loob ng hanay: ang mga kulay ay kinukuha pa rin mula sa buong espasyo, ang mga nasa labas ay tinatanggal, kaya ang bawat kulay sa loob ng hanay ay may parehong tsansa. Walang ipinapadala sa server, walang nilo-log, at ang pahina ay gumagana nang walang koneksyon sa internet pagkatapos ma-load.
Ang tatlong format na ito ay naglalarawan ng parehong kulay sa tatlong paraan. Ang format na “HEX Code” ay ang anim na digit na form tulad ng #0778ff na ginagamit sa CSS at karamihan ng mga design tool; ito ay naisusulat nang may maliit na titik na may # sa harapan, at ang mga opsyon na “Malalaking titik” at “Iwasan ang #” sa “Mga Advanced na Opsyon” ay binabago ito para sa mga tool na umaasahan ng ibang format. Ang format na “RGB Code” ay nagpapakita ng tatlong channel nang hiwalay bilang rgb(7, 120, 255), na angkop para sa code na gumagana sa bawat channel nang indibidwal. Ang format na “HSL Code” ay naglalarawan ng kulay sa pamamagitan ng hue, saturation, at lightness bilang hsl(213, 100%, 51%), na pinaka-maginhawa para sa manual na pagsasaayos pagkatapos. Lahat ng tatlo ay maaaring direktang i-paste sa isang stylesheet. Ngunit hindi sila pantay na tumpak. Ang HEX at RGB ay eksaktong tumpak; ang HSL ay approximate. Ang pahina ay nagsusulat ng hue, saturation, at lightness bilang mga integer, at para sa halos 89% ng mga kulay ang approximated na value na iyon ay hindi babalik sa eksaktong parehong kulay: ang #646503 ay ipinapakita bilang hsl(61, 94%, 20%), na kapag na-convert pabalik ay nagiging #616303. Ang pagkakaiba ay hindi hihigit sa 5 step sa anumang channel, karaniwang 1 o 2 — hindi nakikita ng mata sa screen, ngunit totoo kapag ini-save ang HSL value at inaasahang mababalik ang orihinal na HEX. Kaya i-save ang HEX o RGB bilang ang value na iyong iningatan.
Ang isang kulay na resulta ay nagpapakita bilang isang chip sa gitna; maraming kulay ay nagpapakita bilang may numerong listahan, isang kulay bawat row, na may mga napiling format na nakahanay sa tabi-tabi at isang maliit na badge ng contrast sa dulo ng bawat row. Ang isang listahan na may higit sa tatlong kulay ay mag-scroll sa loob ng kahon, ang arrow sa sulok ay nagbubukas nito sa buong taas; tatandaan ng pahina kung paano mo ito iniwan. I-click ang anumang code upang kopyahin lang iyon. Ang button na “Kopyahin” sa dulo ng isang row ay nagkokopya ng lahat ng code ng kulay na iyon sa isang linya, pinaghihiwalay ng mga space. Ang pag-click sa color swatch ay nagbubukas ng sariling color picker ng iyong browser: ang pagpili ng ibang kulay doon ay magsusulat muli ng bawat code sa row na iyon sa bawat format na iyong na-on kasama ang badge nito. Ang “Kopyahin Lahat” ay nagkokopya ng buong batch, isang kulay bawat linya, ang “I-save sa file” ay nag-save ng parehong teksto bilang .txt file; ang parehong sumusunod sa mga kulay na binago mo sa color picker. Tinatandaan ng “Kasaysayan” ang iyong huling 10 batch sa browser na ito, eksakto tulad ng pagkakagawa sa kanila, at ang “I-clear” ay nagtatanggal ng resulta. Ang iyong mga setting, kasama ang mga nasa “Mga Advanced na Opsyon”, ay natatandaan para sa susunod na pagbisita.
Ang mga kulay na may pantay na tsansa ay hindi mukhang pantay na kumakalat sa isang paraan na makikita ng mata, at ang pag-alam kung ano ang asahan ay nagpipigil sa iyo na pindutin ang “Bumuo ng resulta” para sa maling dahilan. Sa pagsukat sa buong hanay, halos 35% ng mga kulay ay maliwanag at saturated, na may HSL saturation na hindi bababa sa 70% at lightness sa pagitan ng 35%–65%. Ang mga halos grey na may saturation na mas mababa sa 20% ay halos 4% lamang, ang mga napaka-madilim na kulay (lightness na mas mababa sa 20%) at napaka-maliwanag (higit sa 80%) ay bawat isa ay humigit-kumulang 3%. Kaya ang isang batch ng sampung kulay mula sa “Lahat ng kulay” ay karaniwang may ilang matapang na kulay, at ang pastel o halos grey ay bihirang dumating. Kapag kailangan mo ng partikular na uri, pumili sa “Uri ng kulay”: ang “Vivid” ay nagpapanatili lamang ng saturated na grupo na iyon, ang “Pastel”, “Madilim”, “Muted”, at “Grayscale” ay ginagawa ang parehong para sa kanilang sariling kategorya. Ang “Custom” ay nagbibigay-daan sa iyo na magtakda ng iyong sariling mga hanay ng “Hue”, “Saturation”, at “Lightness”, at ang hanay ng hue ay maaaring tumakbo sa nakaraang 0, kaya ang 330 hanggang 30 ay nagbibigay ng mga kulay na pula. Ang hanay ay sinusuri laban sa HSL code na ipinapakita ng pahina, walang code ang lalabas ng hanay, at kung masyadong kakaunti ang mga kulay para sa iyong “Bilang ng mga pipiliin”, hihilingin ng pahina na palawakin ang hanay sa halip na paulit-ulitin ang mga kulay. Kung hindi, ang mga duplicate ay posible ngunit bihira: markahan ang “Iwasan ang mga duplicate” upang harangan sila nang ganap; kung hindi, ang tsansa na dalawa sa 50 na kulay mula sa buong hanay ay magiging magkapareho ay halos 1 sa 13,700.
Ang isang random na kulay ay kadalasang kailangan bilang background, na nagtatanong ng isang bagay na hindi masasagot ng color swatch sa pamamagitan ng pagtingin: mababasa ba ang teksto sa itaas nito? Ang web accessibility na pamantayan WCAG ay nangangailangan ng minimum na contrast ratio na 4.5:1 para sa regular na teksto. Sa pagsukat sa bawat kulay na maaaring gawin ng pahina, ang itim na teksto ay umaabot sa sukatan na iyon sa halos 65% ng mga kulay at ang puting teksto sa halos 36%, at walang kulay ang parehong mabigo: ang mas magandang opsyon ay palaging umaabot ng hindi bababa sa 4.58:1. Kaya para sa anumang random na background, ang itim o puting teksto ay papasa, at ipinapakita ng pahina kung alin. Ang bawat kulay ay may maliit na badge na may nakasulat na Aa sa mas mainam sa dalawa, na sinusundan ng contrast ratio nito. Ang ratio ay binibilog pababa upang hindi kailanman mapaganda ang kulay, at ina-update kapag nagbago ang kulay sa color picker. Ang badge ay naghahambing lamang ng itim at puting teksto; para sa isang brand color o anumang ibang kulay ng teksto, suriin ang pares na iyon sa pamamagitan ng contrast checker.
Ang random ay hindi katulad ng harmonious. Ang bawat kulay sa isang batch ay kinukuha nang nakapag-iisa, nang hindi alam ang iba, kaya ang generator na ito ay hindi kailanman bumubuo ng palette sa kahulugan ng isang designer — walang complementary pairs, walang analogous sequences, walang shared lightness. Ang mas makitid na hanay ay nagbabago ng karakter ng batch, hindi ang panuntunan na iyon: ang mga pastel o serye ng asul ay darating pa rin isa-isa, nang walang anumang ugnayan sa pagitan nila. Iyan ang punto ng tool na ito: ito ay nagbibigay sa iyo ng kulay na hindi mo pipiliin para sa iyong sarili, na nagtatanggal ng ugali o creative block. Upang gawing kapaki-pakinabang ang random na nahanap, panatilihin ang kulay na gusto mo at buuin ang natitira mula rito, sa halip na pindutin ang “Bumuo ng resulta” hanggang sa magkasundo nang nagkataon ang buong set. Panatilihin ang hue nito at baguhin ang lightness para sa magaan at madilim na bersyon, o i-rotate ang hue ng 180 degree para sa kabaligtarang kulay. Ginagawa ng format na “HSL Code” ang mga galaw na iyon ng arithmetic, hindi ng hula.
Bakit pumili ng generator ng random na kulay na ito?
- Ang bawat kulay ay ginagawa sa iyong browser gamit ang Web Crypto API, walang i-upload
- Ang lahat ng 16,777,216 na kulay ay may eksaktong pantay na tsansa, isang random byte bawat channel
- HEX, RGB, at HSL code para sa parehong kulay, sa anumang kumbinasyon
- Hanggang 50 kulay nang sabay-sabay, ang bawat isa ay nasa color swatch na may badge ng contrast
- Vivid, Pastel, Madilim, Muted, at Grayscale, o itakda ang iyong sariling mga hanay ng Hue, Saturation, at Lightness
- Iwasan ang mga duplicate kung kinakailangan, at HEX sa malalaking titik o walang #
- I-click ang code upang kopyahin, o baguhin ang anumang kulay sa color picker ng iyong browser
- Kopyahin Lahat, I-save sa file, at Kasaysayan ng iyong huling 10 batch sa browser
- Libre at walang limitasyon: walang kailangang mag-sign up, walang quota, walang naka-store sa aming mga server
Ang mga random na kulay ay gumagana saan man kailangan ng kulay bago magdesisyon ang sinuman. Ginagamit ito ng mga designer upang mabasag ang creative block at mahanap ang panimulang punto na hindi maabot ng kanilang karaniwang palette. Pinupunan ng mga developer ang mga mockup, placeholder, at avatar, binibigyan ng sariling kulay ang bawat serye sa isang chart bago pa matukoy ang aktwal na tema, at sinusuri kung paano nakakayanan ng interface ang mga background na hindi ito idinisenyo para doon — ang isang batch ng 50 kulay mula sa “Lahat ng kulay” ay halos palaging may kahit isang napaka-madilim o napaka-maliwanag na kulay, ang “Madilim” o “Pastel” ay nagdidirekta ng pagsubok patungo sa isang partikular na dulo. Ang mga generative artist at game prototyper ay direktang nagpapakain ng mga value sa code, kung saan ang format ng RGB ay direktang akma sa karamihan ng mga graphics library. Pinagsasama ng mga guro ang tatlong format upang ipakita kung paano maaaring isulat ang isang kulay bilang code, bilang tatlong channel, o bilang posisyon sa color wheel, at kung bakit ang HSL na bersyon ay na-round. Ang sinumang nag-label, nagtag, o nag-color-code ng isang listahan ay makakakuha ng magkakaibang kulay nang hindi nag-aalala kung ano ang pipiliin.
Mayroon ding ilang tapat na limitasyon na dapat malaman. Ito ay isang generator, hindi isang palette tool: hindi ito nagtatayo ng color harmonies at hindi nagla-lock ng isang kulay habang nagbabago ang iba, at ang mas makitid na hanay ay nagbibigay ng isang uri ng kulay, hindi ng mga kulay na pumiling magkatulad. Ang badge ng contrast ay naghahambing lamang ng itim at puting teksto. Ang pahina ay gumagana sa mga sRGB screen na kulay — HEX, RGB, at HSL — nang walang transparency, at walang CMYK, Pantone, OKLCH, o mga pinangalanang CSS kulay; para sa print, itugma ang kulay sa iyong print workflow sa halip na magtiwala sa screen code. Ang parehong code ay maaaring bahagyang magmukhang iba sa iba't ibang screen dahil ang mga screen ay hindi naka-calibrate nang magkapareho. Ang mga HSL na value ay binibilog tulad ng inilarawan, at kung hindi naka-check ang “Iwasan ang mga duplicate”, ang batch ay hindi sinusuri para sa mga duplicate. Ang ginagarantiya ng pahina ay makitid at tumpak: ang bawat isa sa 16,777,216 na kulay nito, o bawat kulay sa loob ng hanay na iyong itinakda, ay may pantay na tsansa sa bawat press, na kinukuha mula sa cryptographic na pinagkukunan ng iyong browser at hindi kailanman ipinapadala kahit saan.