Els convertidors de colors són una de les eines més utilitzades pels dissenyadors i desenvolupadors frontend, ja que proporcionen una conversió precisa entre diferents representacions del color. El color en si és una percepció visual; per representar-lo als ordinadors i en la impressió, les persones han desenvolupat múltiples models de color (espais de color) que descriuen el mateix color utilitzant diferents sistemes numèrics, cadascun adequat per a diferents escenaris i dispositius.
Els formats de color comuns inclouen: HEX (RGB hexadecimal, la notació web estàndard), RGB (valors de vermell/verd/blau de 0 a 255, la base de les pantalles), HSL (To/Saturació/Lluminositat, el més intuïtiu per a l'ajustament humà del color), CMYK (percentatges de cian/magenta/groc/negre clau per a impressió). En els darrers anys, els espais de color perceptualment uniformes com OKLCH han guanyat popularitat perquè garanteixen matemàticament que els colors amb el mateix valor de lluminositat apareguin visualment amb la mateixa brillantor — quelcom fonamental per construir sistemes de disseny i generar gradients.
Per què convertir entre formats de color? Diferents eines, plataformes i mitjans de sortida utilitzen diferents formats de color: el CSS web admet HEX/RGB/HSL/OKLCH i més; els programaris de disseny com ara Figma/Sketch utilitzen HEX per defecte; la impressió requereix CMYK; i quan s'ajusten dinàmicament els colors al codi (com ara estats de hover o canvis d'opacitat), HSL i OKLCH són molt més convenients que HEX. Una conversió de colors precisa garanteix la coherència del color entre les maquetes de disseny i la implementació final.
El contrast WCAG és un estàndard important per a l'accessibilitat web, que mesura la diferència de luminància entre el text en primer pla i els colors de fons per garantir la llegibilitat als usuaris amb deficiències visuals. El text de cos normal necessita una ràtio de contrast de 4,5:1 (nivell AA), i per al contingut important es recomana 7:1 (nivell AAA). La nostra eina ho calcula en temps real, ajudant els dissenyadors a tenir en compte l'accessibilitat durant la selecció del color en lloc de corregir-la més endavant.
L'harmonia de colors és una teoria clàssica del color basada en la roda de colors, que genera combinacions visualment cohesionades utilitzant les posicions geomètriques dels tons al voltant de la roda. Els colors complementaris creen un fort contrast ideal per a botons i accents; els colors anàlegs són harmoniosos i naturals per a grans àrees de fons; els esquemes triàdics i tetràdics ofereixen equilibri i riquesa per a la identitat de marca. L'eina inclou 5 dels esquemes d'harmonia més utilitzats, que generen paletes amb un sol clic.
Les ombres/clars de color són variacions del mateix to de clar a fosc, la base per construir sistemes de disseny (com ara les paletes 50-900 de Tailwind CSS). Les ombres RGB tradicionals simplement es barregen cap al blanc, però semblen visualment desiguals; les ombres basades en OKLCH mantenen el to i la croma mentre ajusten només la lluminositat, produint transicions visualment suaus de clar a fosc — l'enfocament recomanat per als sistemes de disseny moderns. La nostra eina ofereix tots dos estils d'ombra per comparar.
Per què és important el processament local? La conversió de color és purament matemàtica i no requereix en absolut pujar dades a cap servidor. Tots els càlculs de la nostra eina s'executen completament de forma local al navegador — obriu la pàgina i utilitzeu-la a l'instant sense registrar-vos ni iniciar sessió, i les imatges i les dades de color no es pugen. És ràpid i preserva la privacitat — podeu utilitzar-la amb confiança fins i tot per a colors de maquetes de disseny confidencials que encara no s'han publicat.
Nota important: la conversió de formats de color és matemàticament precisa, però a causa de les gammes de colors de les pantalles, la calibració dels monitors i els processos d'impressió, el mateix valor de color pot aparèixer lleugerament diferent en diferents dispositius i mitjans. Les pantalles utilitzen el RGB additiu (més llum = més brillantor), mentre que la impressió utilitza el CMYK subtractiu (més tinta = més fosc). Tots dos tenen gammes diferents — alguns colors RGB altament saturats no es poden reproduir amb precisió amb les tintes CMYK. Els resultats de la conversió són ideals per al disseny digital i el desenvolupament web; per a la producció impresa final, es recomana utilitzar programari professional de gestió del color per a la prova.
