Web app de la semana: Paletton

No todos los gestores de páginas web tienen el olfato estético de los di­se­ña­do­res, pero la co­m­bi­na­ción de colores de tu página web no tendría por qué verse afectada. La popular apli­ca­ción online Color Scheme Designer tiene una apa­rie­n­cia nueva: la web app gratuita Paletton te puede ayudar a crear co­m­bi­na­cio­nes de colores armónicas con menos clics. Esta he­rra­mie­n­ta online se basa en los co­no­ci­mie­n­tos de la teoría de los colores y establece una gama cromática adicional para cada tono base. De este modo, no solo puedes darle un toque pro­fe­sio­nal a los elementos que co­n­s­ti­tu­yen tu página web, sino también im­pre­sio­nar en pre­se­n­ta­cio­nes e in­fo­gra­fías con una co­m­po­si­ción cromática bien meditada.

Paletton te da la po­si­bi­li­dad de crear tu propia paleta de colores en 5 modos di­fe­re­n­tes: Mo­no­ch­ro­ma­tic, Adjacent Colors, Triad, Tetrad y Free-Style. El punto de partida es cualquier color base, que puedes combinar con hasta tres tonos adi­cio­na­les y con los co­rre­s­po­n­die­n­tes colores co­m­ple­me­n­ta­rios. Para ello, utiliza los si­guie­n­tes mandos:

La selección del tono base y de los colores se­cu­n­da­rios tiene lugar a partir de un círculo cromático.  Sus re­qui­si­tos son muy in­tui­ti­vos: en función de dónde coloques el regulador para el tono base y los colores adi­cio­na­les, Paletton genera una paleta de colores partiendo de los ajustes rea­li­za­dos. Si usas los modos Adjacent Colors, Triad o Tetrad, el concepto cromático se basa en las reglas co­m­bi­na­to­rias pre­via­me­n­te pro­gra­ma­das, que ga­ra­n­ti­zan una co­m­bi­na­ción armónica. Mientras que los valores cro­má­ti­cos pueden definirse por medio del anillo de color externo, la parte interna del círculo cromático ofrece la po­si­bi­li­dad de adaptar los tonos se­le­c­cio­na­dos.

Una vez tienes el concepto cromático, puedes probar los efectos de la co­m­bi­na­ción elegida en gráficos de ejemplo. Para ello, utiliza el botón Examples y elige Page Layout, Artwork o Animated.

Para acceder al código he­xa­de­ci­mal y a otro tipo de in­fo­r­ma­ción sobre tu gama cromática, haz clic en el campo de color co­rre­s­po­n­die­n­te de tu co­m­bi­na­ción de colores para abrir la ventana Color Info.

Como al­te­r­na­ti­va, la apli­ca­ción Paletton plantea la po­si­bi­li­dad de exportar la paleta de colores in­di­vi­dual en diversos formatos, entre ellos CSS, LESS, SASS, XML o swatches para Photoshop. Haz clic en el botón Tables/Export y elige tu formato deseado.