Trebate li boju za maketu, grafikon ili prazno platno, a radije je ne biste birali iz navike? Ovaj besplatni generator slučajnih boja izvlači boje iz punog 24-bit raspona koji zaslon može prikazati i stavlja svaku na uzorak boje pored njezina koda. U polju „Broj” odaberite koliko boja želite — bilo što od 1 do 50 — označite formate koji vam trebaju i pritisnite „Generiraj”. Stranica se otvara s jednom bojom u HEX formatu, pa je prvi rezultat udaljen samo jedan klik. Potvrdni okvir „HEX kod” označen je od početka, „RGB kod” i „HSL kod” nalaze se pored njega, a bilo koja kombinacija ta tri formata može se uključiti istovremeno. Gumb sa zupčanikom pored „Generiraj” otvara odjeljak „Napredne opcije”, gdje možete ograničiti boje na jednu vrstu ili raspon, spriječiti ponavljanja i promijeniti način zapisivanja HEX koda.
Svaka se boja stvara u vašem pregledniku putem Web Crypto API (crypto.getRandomValues), koji pruža kriptografski snažne slučajne bajtove iz vlastitog izvora slučajnosti vašeg sustava, umjesto pseudonasumične funkcije kao što je Math.random(). Boja na zaslonu sastoji se od tri kanala — crvenog, zelenog i plavog — od kojih je svaki cijeli broj od 0 do 255, a jedan slučajni bajt može poprimiti točno 256 vrijednosti. Dakle, svaki je kanal jednostavno jedan bajt, bez ičega između: ne uzima se ostatak pri dijeljenju i nijedna nijansa nije favorizirana korakom pretvorbe. Zbog toga je svih 16.777.216 boja koje stranica može proizvesti potpuno jednako vjerojatno svaki put kada pritisnete „Generiraj”. Uži raspon u odjeljku „Napredne opcije” zadržava to jamstvo unutar zadanog raspona: boje se i dalje izvlače iz cijelog prostora, a sve koje padnu izvan njega odbacuju se, tako da svaka boja koju raspon dopušta ima jednaku šansu. Ništa se ne šalje na poslužitelj, ništa se ne bilježi, a nakon što se stranica učita, nastavlja raditi i bez internetske veze.
Tri formata opisuju istu boju na tri načina. Format „HEX kod” šesteroznamenkasti je oblik koji se koristi u CSS i većini alata za dizajn, poput #0778ff; piše se malim slovima s početnim znakom #, a opcije „Velika slova” i „Bez #” u odjeljku „Napredne opcije” to mijenjaju za alate koji očekuju drukčiji zapis. Format „RGB kod” navodi tri kanala, kao u rgb(7, 120, 255), što odgovara kodu koji radi na svakom kanalu zasebno. Format „HSL kod” opisuje boju prema nijansi, zasićenosti i svjetlini, kao u hsl(213, 100%, 51%), što je najlakši oblik za naknadno ručno prilagođavanje. Sva tri formata mogu se izravno zalijepiti u tablicu stilova. Međutim, nisu jednako precizni. HEX i RGB su točni; HSL je zaokružen. Stranica zapisuje nijansu, zasićenost i svjetlinu kao cijele brojeve, a za oko 89% boja ta se zaokružena vrijednost ne pretvara natrag u potpuno istu boju: #646503 prikazuje se kao hsl(61, 94%, 20%), što se natrag pretvara u #616303. Razlika nikada nije veća od 5 koraka u kanalu i obično je 1 ili 2 — nevidljiva na zaslonu, ali stvarna ako spremite HSL vrijednost i očekujete izvorni HEX natrag. Zato vrijednost spremajte u HEX ili RGB.
Jedna se boja prikazuje kao pojedinačni blok u sredini rezultata; više njih pojavljuje se kao numerirani popis, jedna boja po retku, s odabranim formatima jednim pored drugog i malom oznakom kontrasta na kraju. Popis s više od tri boje pomiče se unutar okvira, a strelica u njegovu kutu otvara ga do pune visine; stranica pamti kako ste je ostavili. Kliknite na bilo koji kod kako biste kopirali samo taj kod. Gumb za kopiranje na kraju retka kopira sve kodove za tu boju u jedan redak, odvojene razmacima. Kliknite na sam uzorak boje i otvorit će se birač boja vašeg preglednika: tamo odaberite drugu boju i svaki kod u tom retku bit će prepisan tako da joj odgovara, u svakom formatu koji ste uključili, zajedno s oznakom kontrasta. Gumb „Kopiraj sve” kopira cijelu seriju, jednu boju po retku, a „Spremi u datoteku” zapisuje isti tekst u običnu .txt datoteku; oba prate svaku boju koju ste promijenili u biraču boja. Odjeljak „Povijest” čuva vaših posljednjih 10 serija u ovom pregledniku, točno onako kako su generirane, a „Očisti” prazni rezultat. Vaše postavke, uključujući one u odjeljku „Napredne opcije”, pamte se za sljedeći posjet.
Jednako vjerojatne boje ne izgledaju ravnomjerno raspoređene, a znanje o tome što očekivati štedi vas od pritiskanja „Generiraj” iz pogrešnog razloga. Mjereno kroz cijeli raspon, oko 35% boja je svijetlo i zasićeno, s HSL zasićenošću od najmanje 70% i svjetlinom između 35% i 65%. Gotovo sive boje, sa zasićenošću ispod 20%, čine samo oko 4%, dok vrlo tamne boje (svjetlina ispod 20%) i vrlo svijetle (iznad 80%) čine oko 3% svaka. Zato će serija od deset boja iz opcije „Sve boje” obično sadržavati nekoliko jakih boja, a rijetko pastelnu ili tamnosivu boju. Kada trebate određenu vrstu, odaberite je u izborniku „Vrsta boje”: stavka „Živopisne” zadržava upravo tu zasićenu skupinu, a „Pastelne”, „Tamne”, „Prigušene” i „Nijanse sive” čine isto za svoje skupine. Opcija „Prilagođene” omogućuje vam postavljanje vlastitih raspona za parametre „Nijansa”, „Zasićenost” i „Svjetlina”, pri čemu raspon nijanse može prijeći preko 0, pa raspon od 330 do 30 daje crvene tonove. Raspon se provjerava u odnosu na HSL kod koji stranica prikazuje, tako da nijedan kod ne pada izvan njega, a ako sadrži premalo boja za zadani „Broj”, stranica traži da ga proširite umjesto ponavljanja boja. Ponavljanja su inače moguća, ali rijetka: označite „Bez ponavljanja” kako biste ih isključili; bez toga je šansa da dvije od 50 boja iz punog raspona budu identične oko 1 prema 13.700.
Slučajna boja često se traži kao pozadina, što otvara jedno pitanje na koje uzorak boje ne može odgovoriti golim okom: hoće li tekst na njoj biti čitljiv? Smjernica za pristupačnost weba, WCAG, traži omjer kontrasta od najmanje 4,5:1 za običan tekst. Mjereno na svakoj boji koju ova stranica može proizvesti, crni tekst postiže to na oko 65% njih, a bijeli tekst na oko 36%, i ne postoji boja na kojoj oba teksta podbace: bolji od ta dva uvijek postiže najmanje 4,58:1. Tako će za svaku slučajnu pozadinu crni ili bijeli tekst biti čitljiv, a stranica vam pokazuje koji. Uz svaku se boju prikazuje mala oznaka na kojoj piše Aa u boljoj od te dvije boje, praćena njezinim omjerom kontrasta. Taj se omjer zaokružuje prema dolje, tako da nikada ne prikazuje bolji kontrast nego što jest, i ažurira se kada promijenite boju u biraču boja. Oznaka uspoređuje samo crni i bijeli tekst; za boju brenda ili bilo koju drugu boju teksta provjerite taj par pomoću alata za provjeru kontrasta.
Slučajno nije isto što i skladno. Svaka se boja u seriji izvlači zasebno, bez ikakvog znanja o ostalima, pa generator nikada ne stvara paletu u dizajnerskom smislu — nema komplementarnih parova, analognih nizova niti zajedničke svjetline. Uži raspon mijenja karakter serije, ali ne i to pravilo: pastelne boje ili niz plavih nijansi i dalje dolaze jedna po jedna, bez ičega što bi ih povezivalo. To je i svrha alata: daje vam boju koju sami ne biste odabrali, što razbija naviku ili kreativnu blokadu. Kako biste slučajno otkriće pretvorili u nešto upotrebljivo, zadržite boju koja vam se sviđa i iz nje izvedite ostale, umjesto da pritišćete „Generiraj” dok se cijeli skup slučajno ne uskladi. Zadržite njezinu nijansu i postupno mijenjajte svjetlinu za svjetlije i tamnije varijante, ili zakrenite nijansu za 180 stupnjeva da dobijete suprotnu boju. Format „HSL kod” omogućuje da ti potezi postanu matematički izračun umjesto nagađanja.
Zašto odabrati ovaj generator slučajnih boja?
- Svaka boja stvorena u vašem pregledniku pomoću Web Crypto API, ništa se ne prenosi
- Svih 16.777.216 boja potpuno jednako vjerojatno, jedan slučajni bajt po kanalu
- HEX, RGB i HSL kodovi za istu boju, u bilo kojoj kombinaciji
- Do 50 boja odjednom, svaka na uzorku boje s oznakom kontrasta teksta
- Živopisne, Pastelne, Tamne, Prigušene i Nijanse sive, ili vlastiti raspon za parametre Nijansa, Zasićenost i Svjetlina
- Bez ponavljanja kada vam zatreba, te Velika slova ili Bez # za HEX kod
- Kliknite na kod za kopiranje ili promijenite bilo koju boju u biraču boja svog preglednika
- Kopiraj sve, Spremi u datoteku i Povijest vaših posljednjih 10 serija, sačuvano u pregledniku
- Besplatno i neograničeno: bez registracije, bez kvota, ništa se ne pohranjuje na našim poslužiteljima
Slučajne boje korisne su posvuda gdje boja treba prije nego što je itko odlučio koja će biti. Dizajneri ih koriste kako bi razbili kreativnu blokadu i pronašli polazište do kojeg njihova uobičajena paleta nikada ne bi došla. Programeri popunjavaju makete, rezervirana mjesta i avatare, dodjeljuju svakoj seriji na grafikonu vlastitu boju dok stvarna tema još nije određena te testiraju kako se sučelje nosi s pozadinama za koje nije izvorno dizajnirano — serija od 50 boja iz opcije „Sve boje” gotovo uvijek uključuje barem jednu vrlo tamnu ili vrlo svijetlu boju, a opcije „Tamne” ili „Pastelne” usmjeravaju testiranje na jedan kraj spektra. Generativni umjetnici i autori prototipova igara unose vrijednosti izravno u kod, gdje se RGB oblik lako uklapa u većinu grafičkih biblioteka. Nastavnici stavljaju tri formata jedan pored drugog kako bi pokazali da se jedna boja može zapisati kao kod, kao tri kanala ili kao položaj na krugu boja, te zašto je HSL verzija zaokružena. A svatko tko označava, dodaje oznake ili bojama kodira popis dobiva razlučive boje bez dvoumljenja oko toga koju odabrati.
Korisno je znati i nekoliko stvarnih ograničenja. Ovo je generator, a ne alat za palete: ne gradi harmonije boja i ne drži jednu boju fiksnom dok se druge mijenjaju, a uži raspon daje boje iste vrste, a ne boje odabrane da se međusobno slažu. Oznaka kontrasta uspoređuje samo crni i bijeli tekst. Stranica radi u sRGB bojama koje zaslon prikazuje — HEX, RGB i HSL — bez prozirnosti i bez CMYK, Pantone, OKLCH ili imenovanih CSS boja; za tisak uskladite boju u svom procesu pripreme za tisak umjesto da se oslanjate na kôd sa zaslona. Isti kôd također može izgledati malo drukčije od jednog zaslona do drugog, jer zasloni nisu jednako kalibrirani. HSL vrijednosti su zaokružene, kao što je gore opisano, i osim ako nije označena opcija „Bez ponavljanja”, serija se ne provjerava na ponavljanja. Ono što stranica jamči uže je i točno: svaka od njezinih 16.777.216 boja, ili svaka boja unutar raspona koji postavite, ima jednaku šansu pri svakom pritisku, izvučena iz kriptografskog izvora vašeg preglednika i nikada nikamo poslana.