Tots sabem que els colors transmeten emocions i que, en disseny web, és molt important fer una bona elecció de la paleta de colors. Així, depenent dels colors que utilitzem, transmetrem uns valors o uns altres d’acord amb el tarannà de l’empresa o institució per la qual estiguem treballant.

Fa temps, en aquest mateix blog, us parlàvem dels esquemes de colors, però avui us volem presentar un llistat molt més exhaustiu d’eines i recursos que us ajudaran a l’hora d’escollir els colors per als vostres dissenys.

Eines genèriques per a treballar amb el color online

• Colorhexa
  Donant un codi de color, t’ofereix un munt d’informació sobre paletes de colors, ombres i tints, variacions del mateix to, conversions en altres formats de color… I també un simulador per a persones amb deficiència en la visió del color.
• Kuler
  És una de les millors eines de creació d’esquemes de color, de la mà d’Adobe.
• Color Scheme Desginer
  Amb una bonica interfície, ofereix un munt d’eines per a escollir colors i les seves variants. Té magnífiques opcions d’exportació (HTML + CSS, XML i paletes de Phothospo o de Gimp). També té opcions d’accessibilitat, amb el “colorblind”, que et permet simular com ho veuen les persones amb algunes de les deficiències més habituals en la visió del color.
• Color Explorer
  Ofereix un recull d’eines molt completes per al tractament del color, per a crear i convertir la teva paleta de colors i també permet escollir colors dels esquemes de colors més coneguts i un convertidor de formats i un analitzador de contrast.
• Color blendy
  Permet anar generant els colors al moment i visualitzar el millor resultat
• Color combinations tester
  Per a crear combinacions de colors
• (Actualitzat Nov- 2018) How Colors Work on the Web in 2018
  Una bona guia per entendre els diversos usos del color aplicat al web i com declarar les seves codificacions en RGB, codi hexadecimal, etc.

Eines per a extreure els colors a partir de pujar una imatge

• Colors Pallete Generator
  Permet pujar una imatge i et genera els colors principals d’aquesta imatge i, a més, t’ho guarda en un arxiu CSS.
• Color Thief
  Un script que et genera els codis de colors de les imatges que hi poses. Utilitza Javascript.
• Pictaculous
  Simplement puges una imatge i automàticament et genera el seu esquema de colors.
• Color hunter
• Colour grab
• Color Palette Generator de DeGraeve.com
• Generador de Paleta de colors de Big Huge Labs

Webs on inspirar-se, crear o compartir paletes de colors

• Color lovers
  És una comunitat online on els afeccionats al color poden crear, compartir i navegar per diferents paletes de color, compartir colors, patrons, parlar sobre les darreres tendències en colors i llegir articles sobre color.
• Instant Color Schemes
  Esquemes de color generats analitzant l’API d’imatges de Yahoo.
• ColorRD
  Per a crear i compartir la inspiració relacionada amb els colors.
• Color Combos

Eines per agafar colors (color pickers)

• Color.hailpixel
  Movent cursor per la pantalla, canvies saturació, to i brillantor.
• Flat UI colors
  Per a treballar en colors per a disseny pla o Flat Design
• Chroma
• Web safe colors
• 0to255
  Una senzilla eina per ajudar als dissenyadors a trobar colors més foscos o més clars a partir de qualsevol color.
• Colllor
  T’ajuda mostrant-te diverses tonalitats del color que hagis escollit
• Color Spire
• 4096 Color Wheel
• Color Wheel de Colors of the web
• Color Ramp Creator
• Color picker
  Quan esculls un color et permet escollir també color complementari, analògic, terciaris, etc.
• CSS color codes
• Devoth‘s HEX 2 RGBA Color Calculator ver 1.0.2
  Ideal per qui treballi en CSS i CSS3. La majoria de convertidors d’RGB et retornen els resultats en 3 camps separats (R, G i B), però moltes vegades es necessita un valor RGB a partir d’un HEX (color hexadecimal) per posar-ho en una propietat CSS. Això facilita molt la feina.
• Color Schemer
• Slayeroffice Color Palette Creator
• Website color match
• Color mixers
• Color blender (actualitzat el desembre del 2014, el web ja no funciona)
• Color DB
• Color Codes Matching Chart HTML
  Llistat de cada color amb els seus formats CMYK, RGB i Hex

Altres eines curioses

• Multicolr Search Lab
  Cercador d’imatges a partir del color: tenint com a base 10 milions d’imatges de Flickr, et permet cercar imatges escollint fins a 5 colors. Molt útil per trobar imatges de determinades tonalitats.
• Stylify Me
  Una eina molt útil! Introdueixes la URL d’un web i et retorna els colors i també els estils principals utilitzats en aquest web.
• Check my colors
  Com en el cas interior, introdueixes una URL i et dóna els colors utilitzats i valora si hi ha algun problema amb el contrast, lluminositat, etc.
• Brand colors
  Per a inspirar-se: t’ofereix els codis de color del color corporatiu de moltes marques conegudes
• Colorzilla
  Extensió molt útil per a Firefox per a agafar els colors dels webs que es visiten

Infografies interessants

• Infografia sobre la psicologia del color en màrqueting
• Infografia dels colors més utilitzats en disseny web, a partir de les 100 principals marques.
• Infografia amb la psicologia del color representada molt gràficament

Teoria del color

• Paletes: Com escollir els colors correctes per als teus dissenys
• Consells i eines per a escollir bé els colors per a desenvolupadors web
• Sèrie d’artciles a Smashing Magazine sobre Teoria del Color per a dissenyadors:
  Part 1: El significat del color
  Part 2: Entenent conceptes i terminologia
  Part 3: Creant la teva pròpia paleta de color
• Com les marques utilitzen la psicologia del color per a persuadir-nos

Esperem que us sigui ben útil!

Amb unes textures carregades de protagonisme, una paleta de colors molt especial, unes formes molt rectangulars i un estil que es balanceja entre el futurisme i el retro, les il·lustracions del jove anglès Matthew Lyons no ens han deixat gens indiferents. És més, ens les miraríem tot escoltant algun tema de Kraftwerk.

Oi que són guapes?