El Material Design es un nuevo estilo de diseño creado y promovido por Google. Aunque es un concepto bastante reciente, Google ya lo está implementando en las nuevas versiones de sistemas operativos para Android y también en muchas aplicaciones propias de Google como Calendar, Gmail, Docs, etc. Ya que el Material Design se está extendiendo poco a poco y está avalado por Google, muchos diseñadores han decidido adoptar este nuevo estilo de diseño en sus aplicaciones móviles.
Google ha puesto a disposición del público una extensa guía sobre el Material Design que seguirá actualizándose conforme este estilo vaya evolucionando en el tiempo. Así que puedes comenzar a aprender sobre Material Design en cualquier momento. Ya que posee técnicas y conceptos nuevos, puede que no sea una tarea sencilla aprender todo lo necesario sobre el Material Design. Por suerte, existen otras herramientas a tu disposición como es el caso de los generadores de colores. En este artículo hemos listado algunos generadores de colores para Material Design, que se dividen en colores primarios y de acento. Google sugiere usar los colores de tipo 500 como primarios y los restantes como acento.
Material Palette
Material Palette te permite crear una paleta de colores para Material Design en base a dos colores. A diferencia de otras herramientas en la lista, te permite seleccionar dos colores y verificar cómo se pueden combinar mediante la vista previa, de este modo también te permite realizar pruebas de color de manera rápida. Una vez hayas finalizado de crear tu paleta de colores, puedes descargarla como imagen PNG o incluso como código (en formato CSS, Sass, Less, entre otros).
Material UI
Material UI es una herramienta completa para diseñadores interesados en el Material Design. Posee una gran variedad de colores, desde los primarios hasta los que puedes emplear como acento. Puedes seleccionar el formato de color en la parte superior derecha (RGB o HEX) e incluso acceder a una vista previa pinchando en la pestaña que se encuentra en el lado derecho. Cada vez que seleccionas un color, éste se copia en el portapapeles para que puedes localizarlo más fácilmente una vez que estés trabajando dentro del programa editor de fotos de tu preferencia.
Random Material Generator
Random Material Generator, como su nombre indica, te permite generar combinaciones de colores para Material Design de manera aleatoria, sólo debes pinchar sobre el botón respectivo. También puedes elegir los colores primarios y de acento de forma manual.
Posee una vista previa que ocupa gran parte de la pantalla, así que puede ser perfecto para realizar pruebas de color antes de tomar una decisión definitiva.
Tint UI
Tint UI es un selector de colores que no sólo es de utilidad en proyectos que estén centrados en el Material Design, sino también para aquellos que sean para otras plataformas como Windows e iOS. Sólo debes seleccionar el color de tu preferencia para que el código HEX se copie automáticamente en el portapeles de tu ordenador.
Material Colors
Material Colors es una herramienta sencilla que posee un número limitado de colores en comparación con otros selectores de color mencionados en la lista, pero es perfecto si no deseas complicarte demasiado al crear tu paleta de colores para Material Design. Posee sólo colores de tipo 500 y 200, al igual que muchas otras herramientas, sólo debes pinchar sobre el color para que éste se copie al portapapeles.
Design Skillz Material Design Colors
Material Design Colors es un selector que posee tanto los colores primarios como de acento para tus proyectos en Material Design. Sólo debes seleccionar el color de tu preferencia para acceder a una serie de variaciones y opciones entre las que puedes elegir. Cada opción presenta sus valores RGB y HEX que puedes copiar y pegar en el editor de tu preferencia.
Material Mixer
Material Mixer facilita el proceso de selección al indicarte las variaciones de colores primarios y de acento que puedes emplear al seleccionar el color principal con el cual deseas trabajar. No sólo te ofrece estas opciones, sino que también posee una vista previa para que compruebes qué tanto combina el color primario con el color de acento.
MaterialUI Colors
MaterialUI Colors es una herramienta bastante interactiva, te permite elegir el tipo de color mediante un botón deslizable. Posee 20 colores principales (sin tomar en cuenta las variaciones de tipo y de tono de cada color). Puedes pinchar sobre el color con el cual deseas trabajar para copiar su código o seleccionar la opción “Ver más” para tener acceso a las variaciones de ese color específico. Al igual que los colores principales, sólo debes pinchar sobre el botón “Copiar” que se activa al colocar el cursor sobre el color para obtener el código respectivo.
Material Design Palette Generator
Material Design Palette Generator es una herramienta que ha sido diseñada para complementar a la framework AngularJS. Con Material Design Palette Generator puedes crear o importar rápidamente un conjunto de colores para poder crear una paleta de colores. Una vez que tienes tu combinación lista puedes asignarle un nombre y exportarla en un formato adecuado para AngularJS.
Material Design Palette Generator cuenta con una gran variación de colores una vez que has seleccionado un color principal. Cada color tiene su código HEX en un lugar visible y un enlace a ColorHexa por si deseas tener mayor información sobre dicho color.
MaterialUp
MaterialUp es otra herramienta que sirve para visualizar colores específicos para Material Design. Muestra los colores primarios uno al lado de otro. Al pinchar sobre un color específico muestra todas las variaciones asociadas a ese color. Cada uno de ellos tiene su código HEX respectivo.
Color Picker
Al igual que MaterialUp, Color Picker te permite visualizar los colores relacionados con el Material Design. Posee diversos filtros que puedes seleccionar para minimizar el número de resultados que muestra. Cada color posee su grado en la escala de Material Design y su código HEX o RGB, según decidas.
En conclusión…
Seleccionar los colores adecuados para un proyecto de diseño no es una tarea sencilla, hay diversos factores que deben tomarse en cuenta. Las posibilidades se limitan al elegir un estilo de diseño específico, como es el caso del Material Design, que ya cuenta con ciertas guías que se deben seguir para poder aplicarlo correctamente en tus proyectos. Pero ciertas herramientas como ls que hemos listados siempre son de ayuda, ya que te permiten visualizar cómo lucirá la combinación de colores que has seleccionado.
