Jednostavan i korisnički prijateljski alat za odabir boja

Uvod

Alat za odabir boja je intuitivna, jednostavna aplikacija dizajnirana da pomogne korisnicima da odaberu, vizualiziraju i konvertiraju boje u više formata boja. Bilo da ste web dizajner koji stvara shemu boja, digitalni umjetnik koji traži savršenu nijansu, ili programer koji implementira korisničko sučelje, ovaj alat za odabir boja pruža jednostavan način za rad s bojama u RGB, heksadecimalnom, CMYK i HSV formatima. Sa svojim interaktivnim spektrom boja, klizačem svjetline i preciznim opcijama unosa, možete brzo pronaći, prilagoditi i kopirati vrijednosti boja za svoje projekte.

Razumijevanje modela boja

Prije nego što zaronimo u način korištenja alata za odabir boja, korisno je razumjeti različite modele boja koje podržava:

RGB (Crvena, Zelena, Plava)

RGB je aditivni model boja u kojem se crvena, zelena i plava svjetlost kombiniraju na različite načine kako bi reproducirali širok spektar boja. U digitalnim aplikacijama:

• Svaka komponenta (R, G, B) kreće se od 0 do 255
• RGB(255, 0, 0) predstavlja čistu crvenu
• RGB(0, 255, 0) predstavlja čistu zelenu
• RGB(0, 0, 255) predstavlja čistu plavu
• RGB(255, 255, 255) predstavlja bijelu
• RGB(0, 0, 0) predstavlja crnu

RGB model je izravno povezan s načinom na koji se boje prikazuju na ekranima, što ga čini primarnim izborom za digitalni dizajn.

Heksadecimalno (Hex)

Heksadecimalni kodovi boja su način predstavljanja RGB boja koristeći sustav brojanja s bazom 16:

• Heksadecimalna boja počinje s znakom #, a zatim slijedi šest znakova
• Prvi par predstavlja crvenu, drugi zelenu, a treći plavu
• Svaki par se kreće od 00 do FF (0-255 u decimalnom)
• #FF0000 predstavlja čistu crvenu
• #00FF00 predstavlja čistu zelenu
• #0000FF predstavlja čistu plavu
• Kratki zapis je dostupan za određene boje (npr. #F00 za crvenu)

Hex kodovi se široko koriste u web razvoju (CSS, HTML) i aplikacijama za digitalni dizajn.

CMYK (Cijan, Magenta, Žuta, Key/Crna)

CMYK je oduzimajući model boja koji se prvenstveno koristi u boji tiska:

• Svaka komponenta se kreće od 0% do 100%
• CMYK(0, 100, 100, 0) predstavlja čistu crvenu
• CMYK(100, 0, 100, 0) predstavlja čistu zelenu
• CMYK(100, 100, 0, 0) predstavlja čistu plavu
• CMYK(0, 0, 0, 100) predstavlja crnu
• CMYK(0, 0, 0, 0) predstavlja bijelu (boja papira)

Iako se prvenstveno koristi za tisak, razumijevanje CMYK vrijednosti može biti korisno prilikom dizajniranja sadržaja koji će na kraju biti otisnut.

HSV (Hue, Saturacija, Vrijednost)

HSV predstavlja boje u smislu:

• Hue: Tip boje (crvena, žuta, zelena, itd.), mjereno u stupnjevima (0-360°)
• Saturacija: Intenzitet ili čistoća boje (0-100%)
• Vrijednost: Svjetlost boje (0-100%)

HSV je posebno koristan za odabir boja jer odvaja izbor boje (hue) od njene intenziteta (saturacija) i svjetline (vrijednost), čineći intuitivnijim prilagođavanje boja.

Formule za konverziju boja

Alat za odabir boja automatski konvertira između različitih modela boja koristeći ove matematičke formule:

RGB u Hex konverzija

Da biste konvertirali RGB u heksadecimalno:

1. Pretvorite svaku RGB komponentu (0-255) u dvocifreni heksadecimalni broj
2. Spojite tri heksadecimalne vrijednosti s # prefiksom

$\text{Hex} = \text{\#} + \text{toHex}(R) + \text{toHex}(G) + \text{toHex}(B)$

Gdje toHex() pretvara decimalni broj u njegovu heksadecimalnu reprezentaciju.

RGB u CMYK konverzija

Konverzija iz RGB u CMYK uključuje sljedeće korake:

1. Normalizirajte RGB vrijednosti u rasponu 0-1
2. Izračunajte komponentu crne boje (K)
3. Izračunajte C, M i Y na temelju K

$R' = R/255, G' = G/255, B' = B/255$ $K = 1 - \max(R', G', B')$ $C = \frac{(1-R'-K)}{(1-K)} \times 100\%$ $M = \frac{(1-G'-K)}{(1-K)} \times 100\%$ $Y = \frac{(1-B'-K)}{(1-K)} \times 100\%$

RGB u HSV konverzija

Konvertiranje RGB u HSV:

$R' = R/255, G' = G/255, B' = B/255$ $C_{max} = \max(R', G', B')$ $C_{min} = \min(R', G', B')$ $\Delta = C_{max} - C_{min}$

Za Hue (H):

0° & \text{if } \Delta = 0 \\ 60° \times (\frac{G' - B'}{\Delta} \mod 6) & \text{if } C_{max} = R' \\ 60° \times (\frac{B' - R'}{\Delta} + 2) & \text{if } C_{max} = G' \\ 60° \times (\frac{R' - G'}{\Delta} + 4) & \text{if } C_{max} = B' \end{cases}$$ Za Saturaciju (S): $$S = \begin{cases} 0 & \text{if } C_{max} = 0 \\ \frac{\Delta}{C_{max}} \times 100\% & \text{otherwise} \end{cases}$$ Za Vrijednost (V): $$V = C_{max} \times 100\%$$ ## Kako koristiti alat za odabir boja Naš alat za odabir boja pruža više načina za odabir i prilagodbu boja. Evo korak-po-korak vodiča o tome kako koristiti svaku funkciju: ### Korištenje spektra boja 1. **Odaberite osnovnu boju**: Kliknite ili dodirnite bilo gdje na spektru boja da biste odabrali osnovnu boju. Horizontalna pozicija određuje nijansu, dok vertikalna pozicija utječe na saturaciju. 2. **Fino podešavanje odabira**: Možete povući krug odabira oko da pronađete savršenu nijansu boje. 3. **Pogledajte pregled boje**: Dok se krećete s odabiračem, područje pregleda boje se ažurira u stvarnom vremenu, pokazujući vaš trenutni odabir. ### Prilagodba svjetline 1. **Koristite klizač svjetline**: Ispod spektra boja, naći ćete horizontalni klizač koji kontrolira svjetlinu (vrijednost) vaše odabrane boje. 2. **Povucite lijevo ili desno**: Pomaknite klizač lijevo da biste potamnili boju ili desno da biste je posvijetlili. 3. **Promatrajte promjene**: Pregled boje i sve vrijednosti boja se odmah ažuriraju dok prilagođavate svjetlinu. ### Unos preciznih vrijednosti boja Za točan odabir boje, možete izravno unijeti vrijednosti u bilo kojem od podržanih formata: #### Hex unos 1. Unesite važeći heksadecimalni kod boje u Hex polje (npr. #FF5733) 2. Unos automatski validira vaš unos 3. Pritisnite Enter ili kliknite izvan polja da primijenite boju #### RGB unos 1. Unesite vrijednosti između 0-255 za svaku RGB komponentu 2. Sva ostala polja formata boja se automatski ažuriraju 3. Nevažeće vrijednosti (izvan 0-255) bit će ograničene na važeći raspon #### CMYK unos 1. Unesite postotne vrijednosti (0-100) za Cijan, Magentu, Žutu i Crnu 2. Ostali formati boja se ažuriraju na temelju vašeg CMYK unosa 3. Vrijednosti izvan raspona 0-100 bit će automatski prilagođene ### Kopiranje vrijednosti boja 1. **Kliknite na gumb Kopiraj**: Pored svake boje formata, naći ćete gumb za kopiranje (ikona clipboard) 2. **Trenutna povratna informacija**: Nakon klika, kratka poruka "Kopirano!" se pojavljuje 3. **Zalijepite bilo gdje**: Kopirana vrijednost se sada može zalijepiti u vaš dizajnerski softver, uređivač koda ili bilo koju drugu aplikaciju ## Primjene Alat za odabir boja služi raznim svrhama u različitim područjima: ### Web razvoj Web programeri mogu koristiti alat za odabir boja da: - Odaberu boje za teme web stranica i UI komponente - Pronađu dostupne kombinacije boja koje zadovoljavaju WCAG smjernice - Konvertiraju između hex kodova (koji se koriste u CSS-u) i RGB vrijednosti - Kreiraju palete boja za dosljedno brendiranje na web stranicama Primjer radnog toka: 1. Koristite spektar boja da pronađete osnovnu boju za temu web stranice 2. Prilagodite svjetlinu kako biste stvorili varijacije za hover stanja i pozadine 3. Izravno kopirajte hex kod u CSS stilove 4. Koristite RGB vrijednosti za rgba() funkcije kada je potrebna prozirnost ### Grafički dizajn Grafički dizajneri imaju koristi od: - Preciznog odabira boja za digitalna umjetnička djela - Konvertiranja između RGB (za digitalno) i CMYK (za tisak) - Kreiranja harmoničnih shema boja - Usklađivanja specifičnih boja brenda Primjer radnog toka: 1. Unesite specifičnu boju brenda u hex formatu 2. Koristite spektar boja da pronađete komplementarne boje 3. Provjerite CMYK vrijednosti kako biste osigurali kompatibilnost s tiskom 4. Kopirajte vrijednosti u dizajnerski softver kao što su Adobe Illustrator ili Photoshop ### UI/UX dizajn UI/UX dizajneri mogu: - Odabrati boje koje poboljšavaju upotrebljivost i čitljivost - Kreirati dosljedne sustave boja za aplikacije - Brzo testirati različite kombinacije boja - Osigurati dovoljnu kontrastnost između boje teksta i pozadine Primjer radnog toka: 1. Odaberite primarnu boju koristeći spektar boja 2. Prilagodite svjetlinu kako biste stvorili sekundarne i tercijarne boje 3. Testirajte različite kombinacije u području pregleda 4. Kopirajte vrijednosti u dizajnerske sustave ili alate za prototipiranje ### Digitalna umjetnost Digitalni umjetnici koriste alate za odabir boja da: - Pronađu savršenu nijansu za digitalne slike - Kreiraju prilagođene palete boja - Usklade boje iz referentnih slika - Eksperimentiraju s konceptima teorije boja Primjer radnog toka: 1. Koristite HSV kontrole da odaberete specifičnu nijansu 2. Prilagodite saturaciju i svjetlinu za željeni efekt 3. Kopirajte RGB vrijednosti u softver za digitalno slikanje 4. Kreirajte varijacije blago prilagođavajući nijansu ili saturaciju ### Obrazovanje Alat za odabir boja služi kao edukativni alat za: - Poučavanje konceptima teorije boja - Demonstriranje konverzija modela boja - Objašnjavanje digitalne reprezentacije boja - Pomoć studentima da razumiju odnose boja Primjer radnog toka: 1. Pokažite kako prilagođavanje nijanse mijenja boju dok održava svjetlinu 2. Demonstrirajte kako RGB vrijednosti odgovaraju vidljivim bojama 3. Objasnite odnos između hex kodova i RGB vrijednosti 4. Ilustrirajte kako se CMYK razlikuje od RGB za tisak u odnosu na digitalne aplikacije ### Alternativne opcije Iako naš alat za odabir boja pruža sveobuhvatnu funkcionalnost, postoje alternativni pristupi odabiru boja: #### Generator paleta boja Alati poput Adobe Color, Coolors i Paletton fokusiraju se na stvaranje harmoničnih shema boja umjesto na odabir pojedinačnih boja. Idealni su kada trebate razviti kompletnu paletu boja temeljem principa teorije boja. #### Alati za ekstrakciju boja iz slika Alati poput ColorZilla i ImageColorPicker omogućuju vam da izvučete boje izravno iz slika ili bilo gdje na vašem ekranu. Ovi su posebno korisni kada trebate uskladiti postojeće boje iz fotografija ili dizajna. #### Fizički sustavi boja Za rad usmjeren na tisak, fizički sustavi boja poput Pantone, CMYK uzoraka ili RAL kartica boja pružaju standardizirane reference koje osiguravaju točnost boje kroz različite procese tiska. #### Ugrađeni alati softvera Većina dizajnerskog softvera (Adobe Photoshop, Illustrator, Figma, itd.) uključuje ugrađene alate za odabir boja. Iako su praktični, često su ograničeni na aplikaciju i ne pružaju konverziju između formata koju naš alat nudi. ## Povijest digitalnog odabira boja Evolucija alata za odabir boja paralelna je razvoju digitalnog dizajna: ### Rane digitalne boje (1970-e-1980-e) Prvi digitalni sustavi boja bili su ozbiljno ograničeni hardverskim ograničenjima: - Rani računalni monitori mogli su prikazivati samo 16 ili 256 boja - Boje su se birale iz unaprijed definiranih paleta - Razvijena je web-safe paleta boja (216 boja) kako bi se osigurala kompatibilnost između preglednika ### RGB i Hex standardi (1990-e) Kako je tehnologija napredovala: - 24-bitna boja postala je standard, omogućujući 16,7 milijuna boja - Heksadecimalna notacija usvojena je za HTML i CSS - Osnovni alati za odabir boja pojavili su se u dizajnerskom softveru - Web dizajneri bili su ograničeni na nazive boja i hex kodove ### Moderni odabir boja (2000-e-danas) Današnji alati za odabir boja odražavaju naše sofisticirano razumijevanje digitalne boje: - Alati za odabir boja u stvarnom vremenu s vizualnim sučeljima - Podrška za više modela boja (RGB, HSL, HSV, CMYK) - Alati za dostupnost boja za provjeru omjera kontrasta - Napredni algoritmi harmonije boja - Integracija s dizajnerskim sustavima i knjižnicama komponenti Razvoj alata za odabir boja nastavlja se razvijati s napretkom u tehnologiji prikaza, znanosti o bojama i metodologijama dizajna. ## Razmatranja o pristupačnosti boja Kada birate boje, važno je razmotriti pristupačnost za korisnike s oštećenjem vida boja: ### Tipovi sljepoće boja - **Protanopija**: Teškoće u percepciji crvenih boja - **Deuteranopija**: Teškoće u percepciji zelenih boja - **Tritanopija**: Teškoće u percepciji plavih boja - **Akrhomatopsija**: Potpuna sljepoća boja (vidi samo u sivim tonovima) ### Savjeti za pristupačnost 1. **Ne oslanjajte se isključivo na boju** za prenošenje informacija 2. **Osigurajte dovoljnu kontrastnost** između teksta i pozadine (minimalno 4.5:1 za normalni tekst) 3. **Koristite uzorke ili teksture** pored boja za grafikone i dijagrame 4. **Testirajte svoje odabire boja** s emulatorima sljepoće boja 5. **Razmotrite korištenje paleta prijateljskih prema sljepoći boja** koje izbjegavaju problematične kombinacije boja ## Često postavljana pitanja ### Koja je razlika između RGB i CMYK modela boja? RGB (Crvena, Zelena, Plava) je aditivni model boja koji se koristi za digitalne prikaze gdje se boje stvaraju dodavanjem svjetlosti. CMYK (Cijan, Magenta, Žuta, Crna) je oduzimajući model koji se koristi u tisku gdje se boje stvaraju apsorpcijom (oduzimanjem) svjetlosti. RGB proizvodi svjetlije, živopisnije boje idealne za digitalne medije, dok CMYK obično ima ograničeniju gamu pogodnu za tiskane materijale. ### Zašto boje izgledaju drugačije na mom ekranu u odnosu na kada su otisnute? Ova razlika se javlja jer ekrani koriste RGB model boja koji može prikazati širi spektar boja nego što je moguće s CMYK tiskarskim tintama. Osim toga, ekrani emitiraju svjetlost dok tiskani materijali reflektiraju. Razlike u kalibraciji između uređaja, kvaliteta papira i varijacije tinte također doprinose ovoj razlici. Za rad usmjeren na tisak, uvijek provjeravajte CMYK vrijednosti i razmotrite zahtjev za fizičnim dokazima. ### Kako mogu pronaći hex kod za specifičnu boju koju vidim online? Možete koristiti proširenja preglednika poput ColorZilla ili ugrađene alate za razvojne programere. U Chromeu ili Firefoxu, desnom tipkom miša kliknite na element, odaberite "Inspekcija", a zatim upotrijebite alat za odabir boje u panelu za razvojne alate. Alternativno, napravite snimku ekrana i prenesite je u naš alat za odabir boja, a zatim kliknite na željenu boju da biste dobili njezin hex kod. ### Koji je najbolji način za stvaranje kohezivne sheme boja? Započnite s primarnom bojom koja predstavlja vaš brend ili raspoloženje projekta. Zatim koristite principe teorije boja poput komplementarnih (suprotno na kotaču boja), analognim (susjednim na kotaču boja) ili triadičnih (ravnomjerno raspoređenih oko kotača boja) odnosa kako biste odabrali dodatne boje. Prilagodite saturaciju i svjetlinu kako biste stvorili hijerarhiju. Naš alat za odabir boja pomaže vam vizualizirati te odnose i fino prilagoditi vaše odabire. ### Kako mogu osigurati da su moje odabrane boje pristupačne? Provjerite omjer kontrasta između boje teksta i pozadine koristeći alate poput WebAIM Contrast Checker. Za normalni tekst, ciljajte na minimalni omjer od 4.5:1, a za veliki tekst 3:1. Izbjegavajte problematične kombinacije boja za korisnike s oštećenjem vida boja (poput crvene/zeleno). Testirajte svoj dizajn s emulatorima sljepoće boja. Zapamtite da oko 8% muškaraca i 0.5% žena ima neku vrstu oštećenja vida boja. ### Što znači # simbol u hex kodovima boja? Hash ili znak # je prefiks koji označava da sljedeći znakovi predstavljaju heksadecimalni kod boje. To je standardna notacija u HTML-u, CSS-u i mnogim dizajnerskim aplikacijama. Šest znamenki koje slijede predstavljaju RGB vrijednosti u bazi-16 formatu, pri čemu prvi par predstavlja crvenu, drugi zelenu, a treći plavu. ### Kako da konvertiram boju iz RGB u CMYK za tisak? Naš alat za odabir boja automatski konvertira RGB vrijednosti u njihove CMYK ekvivalente. Jednostavno unesite svoje RGB vrijednosti, a odgovarajuće CMYK vrijednosti će se prikazati. Međutim, imajte na umu da neke RGB boje padaju izvan CMYK gamuta i ne mogu se točno reproducirati u tisku. Profesionalni dizajnerski softver poput Adobe Illustratora ili Photoshopa također pruža konverziju načina boja s upozorenjima o gamutu. ### Zašto postoje i 3-cifreni i 6-cifreni hex kodovi? 3-cifreni hex kod je kratak zapis koji se može koristiti kada se svaki par komponenti može predstaviti ponovljenim znamenkama. Na primjer, #FF0000 može se skratiti na #F00 jer F=FF, 0=00, i 0=00. Ovaj kratak zapis radi samo za boje gdje se svaka komponenta može predstaviti ponovljenim znamenkama. Izvorno je uveden kako bi se uštedio prostor u datoteci u ranim danima weba, ali ostaje zgodan kratak zapis. ### Koliko su točne konverzije boja između različitih modela? Konverzije između RGB i hex su matematički točne jer su izravne reprezentacije istih vrijednosti u različitim formatima. Konverzije između RGB i CMYK su aproksimacije zbog temeljnih razlika u gamutu boja i fizičkim svojstvima emisije svjetlosti nasuprot apsorpciji tinte. Naš alat koristi industrijske standardne formule kako bi pružio najtočnije moguće konverzije unutar ovih ograničenja. ### Mogu li spremiti ili izvesti svoje odabrane boje? Trenutno možete kopirati pojedinačne vrijednosti boja u svoju međuspremnicu. Preporučujemo da kreirate dokument ili koristite alat za palete boja kako biste spremili više boja za svoje projekte. Buduće nadogradnje mogu uključivati značajke za izradu paleta boja izravno unutar alata. ## Primjeri koda za konverzije boja Evo nekoliko primjera koda koji pokazuju kako konvertirati između različitih formata boja:

1// RGB u Hex konverzija
2function rgbToHex(r, g, b) {
3  const toHex = (c) => {
4    const hex = Math.round(c).toString(16);
5    return hex.length === 1 ? '0' + hex : hex;
6  };
7  
8  return `#${toHex(r)}${toHex(g)}${toHex(b)}`;
9}
10
11// Hex u RGB konverzija
12function hexToRgb(hex) {
13  // Uklonite # ako je prisutan
14  const cleanHex = hex.startsWith('#') ? hex.slice(1) : hex;
15  
16  // Rukovanje s 3-cifrenim i 6-cifrenim hex
17  const expandedHex = cleanHex.length === 3 
18    ? cleanHex.split('').map(char => char + char).join('')
19    : cleanHex;
20    
21  const r = parseInt(expandedHex.substring(0, 2), 16);
22  const g = parseInt(expandedHex.substring(2, 4), 16);
23  const b = parseInt(expandedHex.substring(4, 6), 16);
24  
25  return { r, g, b };
26}
27
28// RGB u CMYK konverzija
29function rgbToCmyk(r, g, b) {
30  // Normalizirajte RGB vrijednosti
31  const normalizedR = r / 255;
32  const normalizedG = g / 255;
33  const normalizedB = b / 255;
34  
35  // Izračunajte K (crna)
36  const k = 1 - Math.max(normalizedR, normalizedG, normalizedB);
37  
38  // Rukovanje čistom crnom
39  if (k === 1) {
40    return { c: 0, m: 0, y: 0, k: 100 };
41  }
42  
43  // Izračunajte C, M, Y
44  const c = ((1 - normalizedR - k) / (1 - k)) * 100;
45  const m = ((1 - normalizedG - k) / (1 - k)) * 100;
46  const y = ((1 - normalizedB - k) / (1 - k)) * 100;
47  
48  return {
49    c: Math.round(c),
50    m: Math.round(m),
51    y: Math.round(y),
52    k: Math.round(k * 100)
53  };
54}
55
56// Primjer korištenja
57const rgb = { r: 255, g: 0, b: 0 }; // Čista crvena
58console.log(`Hex: ${rgbToHex(rgb.r, rgb.g, rgb.b)}`);
59console.log(`CMYK:`, rgbToCmyk(rgb.r, rgb.g, rgb.b));
60

1# RGB u Hex konverzija
2def rgb_to_hex(r, g, b):
3    return f'#{r:02x}{g:02x}{b:02x}'
4
5# Hex u RGB konverzija
6def hex_to_rgb(hex_color):
7    # Uklonite # ako je prisutan
8    hex_color = hex_color.lstrip('#')
9    
10    # Rukovanje s 3-cifrenim i 6-cifrenim hex
11    if len(hex_color) == 3:
12        hex_color = ''.join([c*2 for c in hex_color])
13    
14    return {
15        'r': int(hex_color[0:2], 16),
16        'g': int(hex_color[2:4], 16),
17        'b': int(hex_color[4:6], 16)
18    }
19
20# RGB u CMYK konverzija
21def rgb_to_cmyk(r, g, b):
22    # Normalizirajte RGB vrijednosti
23    r_norm = r / 255.0
24    g_norm = g / 255.0
25    b_norm = b / 255.0
26    
27    # Izračunajte K (crna)
28    k = 1 - max(r_norm, g_norm, b_norm)
29    
30    # Rukovanje čistom crnom
31    if k == 1:
32        return {'c': 0, 'm': 0, 'y': 0, 'k': 100}
33    
34    # Izračunajte C, M, Y
35    c = ((1 - r_norm - k) / (1 - k)) * 100
36    m = ((1 - g_norm - k) / (1 - k)) * 100
37    y = ((1 - b_norm - k) / (1 - k)) * 100
38    
39    return {
40        'c': round(c),
41        'm': round(m),
42        'y': round(y),
43        'k': round(k * 100)
44    }
45
46# Primjer korištenja
47rgb = {'r': 0, 'g': 128, 'b': 255}  # Nebesko plava
48hex_color = rgb_to_hex(rgb['r'], rgb['g'], rgb['b'])
49cmyk = rgb_to_cmyk(rgb['r'], rgb['g'], rgb['b'])
50
51print(f"Hex: {hex_color}")
52print(f"CMYK: C={cmyk['c']}%, M={cmyk['m']}%, Y={cmyk['y']}%, K={cmyk['k']}%")
53

1public class ColorConverter {
2    // RGB u Hex konverzija
3    public static String rgbToHex(int r, int g, int b) {
4        return String.format("#%02x%02x%02x", r, g, b);
5    }
6    
7    // Hex u RGB konverzija
8    public static int[] hexToRgb(String hexColor) {
9        // Uklonite # ako je prisutan
10        if (hexColor.startsWith("#")) {
11            hexColor = hexColor.substring(1);
12        }
13        
14        // Rukovanje s 3-cifrenim i 6-cifrenim hex
15        if (hexColor.length() == 3) {
16            String expandedHex = "";
17            for (char c : hexColor.toCharArray()) {
18                expandedHex += c + String.valueOf(c);
19            }
20            hexColor = expandedHex;
21        }
22        
23        int r = Integer.parseInt(hexColor.substring(0, 2), 16);
24        int g = Integer.parseInt(hexColor.substring(2, 4), 16);
25        int b = Integer.parseInt(hexColor.substring(4, 6), 16);
26        
27        return new int[]{r, g, b};
28    }
29    
30    // RGB u CMYK konverzija
31    public static double[] rgbToCmyk(int r, int g, int b) {
32        // Normalizirajte RGB vrijednosti
33        double normalizedR = r / 255.0;
34        double normalizedG = g / 255.0;
35        double normalizedB = b / 255.0;
36        
37        // Izračunajte K (crna)
38        double k = 1 - Math.max(Math.max(normalizedR, normalizedG), normalizedB);
39        
40        // Rukovanje čistom crnom
41        if (k == 1) {
42            return new double[]{0, 0, 0, 100};
43        }
44        
45        // Izračunajte C, M, Y
46        double c = ((1 - normalizedR - k) / (1 - k)) * 100;
47        double m = ((1 - normalizedG - k) / (1 - k)) * 100;
48        double y = ((1 - normalizedB - k) / (1 - k)) * 100;
49        
50        return new double[]{
51            Math.round(c),
52            Math.round(m),
53            Math.round(y),
54            Math.round(k * 100)
55        };
56    }
57    
58    public static void main(String[] args) {
59        // Primjer korištenja
60        int r = 75, g = 0, b = 130;  // Ljubičasta
61        String hexColor = rgbToHex(r, g, b);
62        double[] cmyk = rgbToCmyk(r, g, b);
63        
64        System.out.println("Hex: " + hexColor);
65        System.out.printf("CMYK: C=%.0f%%, M=%.0f%%, Y=%.0f%%, K=%.0f%%\n", 
66                          cmyk[0], cmyk[1], cmyk[2], cmyk[3]);
67    }
68}
69

Reference

1. Agoston, M. K. (2013). Računalna grafika i geometrijsko modeliranje: Implementacija i algoritmi. Springer Science & Business Media.

2. Adobe Systems. (2000). Adobe RGB (1998) Color Image Encoding. Adobe Systems Incorporated.

3. Fairchild, M. D. (2013). Modeli izgleda boje. John Wiley & Sons.

4. Hunt, R. W. G., & Pointer, M. R. (2011). Mjerenje boje. John Wiley & Sons.

5. Poynton, C. (2012). Digitalni video i HD: Algoritmi i sučelja. Elsevier.

6. W3C. (2018). CSS Color Module Level 4. W3C Radni nacrt. Preuzeto s https://www.w3.org/TR/css-color-4/

7. Smjernice za pristupačnost web sadržaja (WCAG) 2.1. (2018). Preuzeto s https://www.w3.org/TR/WCAG21/

8. Međunarodni kolor konzorcij. (2004). Specifikacija ICC.1:2004-10 (Verzija profila 4.2.0.0). Preuzeto s http://www.color.org/specification/ICC1v42_2006-05.pdf

Isprobajte naš alat za odabir boja danas!

Spremni ste pronaći savršenu boju za svoj projekt? Naš jednostavni alat za odabir boja olakšava odabir, prilagodbu i konverziju boja između različitih formata. Bilo da dizajnirate web stranicu, kreirate digitalnu umjetnost ili planirate tiskane materijale, naš alat pruža preciznost i fleksibilnost koju trebate.

Započnite s eksperimentiranjem s bojama sada i podignite svoje dizajne na sljedeću razinu!