En el momento de crear cualquier tipo de diseño, ya estemos hablando de una web, el prototipado de una aplicación, una ilustración o cuando inventamos un nuevo logotipo, la elección de los colores es una parte esencial. Y seguramente en más de una ocasión, sobre todo cuando trabajamos en equipo y tenemos una paleta de colores amplia, os habéis encontrado en una situación donde es complicado tratar de nombrar un color exacto a un compañero. Ahí es cuando entra en valor el uso de la nomenclatura de colores.
Porque cuando tenemos una paleta con colores muy diferenciados, es muy sencillo: esto es rojo, esto es azul y esto es amarillo. Hasta aquí todos de acuerdo. ¿Pero qué ocurre cuando estemos usando un mismo tono de rojo con diferentes luminosidades?. ¿O si trabajamos en una escala de grises?. Si usamos gris claro y gris oscuro, pronto nos quedamos sin adjetivos a menos que estemos echando mano del diccionario de sinónimos. Aunque esto no es lo más óptimo cuando estemos trabajando.
Por eso hoy queríamos hacer este artículo, para proponeros diferentes nomenclaturas de colores que podemos utilizar y aplicar en nuestros diseños para hacerlos más eficaces y que sea más sencillo de trabajar con ellos. No solo cuando lo hacemos en equipo, sino también si estamos en solitario, ya que nos da una herramienta más que aplicar a nuestros proyectos de forma transversal. Y que no tengamos que estar pensando en cada nuevo proyecto de que forma vamos a nombrar los colores esta vez.
Tipos de nomenclatura que podemos usar
Como hemos dicho antes, no hay una única nomenclatura que podemos usar y, por supuesto ninguna es correcta o mejor que las demás. Al final, todo se trata de escoger una (o la combinación de varias) que mejor se adapte a nuestro método de trabajo y que nos haga ser más eficientes.
Usar el código de color
Este es el primero que se nos viene a la cabeza, y es directamente el código de color correspondiente. Podemos elegir el típico RGB, el HEX utilizado comúnmente en la web, o el HSL que recomendamos hace tiempo en Silo, entre otros.
La parte negativa es que, a simple vista, es difícil imaginar con exactitud por su código que color se esta usando. La positiva es que, usando códigos como el HSL, es sencillo crear variaciones de una misma tonalidad simplemente modificando sus valores, sin tener que ver directamente el color.
Buscar un nombre exacto
Si ya hemos dicho que lo de nombrar como rojo o azul nuestros colores se nos puede quedar corto muy pronto, existen alternativas para ampliar estas posibilidades. Una de las opciones es usar las tablas de Pantone, en la que muchos colores tienen ya un nombre propio. Por ejemplo, en el 2022 eligieron como color del año Veri Peri, un color violeta con código HEX #6667AB. Como este, tienen infinidad de colores con su propio nombre.
También existen herramientas como Color-Name donde, introduciendo un código de color HEX, nos devolverá una nombre. Si le damos el código HEX #BF8751, veremos que lo nombra como Coffee Stain. De esta forma, tenemos un conversor muy sencillo de usar y donde obtendremos un nombre a utilizar de forma rápida sin tener que buscar uno por nosotros mismos.
Utilizar un nombre contextual
Los que os dediquéis al diseño web, seguro que os suena esta nomenclatura. Y es que no es más que darle una denominación al color según su utilización dentro de un proyecto, o cuando se utiliza. Aquí nos olvidamos por completo de su color, esto es totalmente funcional. El color más usado lo llamaremos primary, el siguiente secondary, y así. A partir de aquí, vamos añadiéndole apellidos a la nomenclatura. Si en una web usamos el color primary en un botón, y tiene este color tiene una luminosidad diferente al pasar el puntero por encima (o hacer hover), llamaremos a este nuevo color primary-hover.
Como hemos dicho, es habitual utilizar este tipo de nomenclatura en diseño web, sobre todo cuando hacemos uso de variables CSS, ya que nos permite casi abstraernos de que color exacto estamos usando, y pensar solo en su funcionalidad dentro del proyecto en conjunto. Además de que, ante cualquier cambio brusco de color (si de repente el color primary pasa de azul a granate), no nos afecta a nuestra nomenclatura y podemos seguir usándola.
Buscar un nombre reconocible
La última opción es una más informal, y que en proyectos más pequeños y con gente más cercana se está haciendo habitual. No es más que usar nombres populares o que son reconocibles dentro del propio equipo o por las personas que van a trabajar en el proyecto. Para explicarlo, vayámonos a algo cercano. En la web de Silo es habitual encontrar un tono de rojo, que tiene un código HEX #B92326. A la hora de trabajar, es algo farragoso estar nombrando elementos con esta nomenclatura, por lo que podemos designarlo como silo-red. Solo con leerlo, ya sabemos a que color nos referimos. Pero no solo hay que limitarse a conocimientos internos, sino que podemos aplicarlo a temas populares. Desde pikachu-yellow a twitter-blue. Aquí las posibilidades son casi ilimitadas.
Añadiendo información extra a nuestra nomenclatura
Una vez tenemos claro cuales son nuestras opciones a la hora de nombrar colores y las nomenclaturas existentes, podemos ir un paso más allá y añadir otra capa de información. Una de mis estrategias favoritas es la de terminar la nomenclatura que estemos usando con una numeración, que nos va a ayudar sobre todo cuando tenemos una misma tonalidad con variantes. Y que nos va a liberar del todo de la indefinición al usar nombres de colores con los apellidos claro y oscuro.
Lo primero es definir cual es nuestro tono base, y a este añadirle al final un -500. Así, podemos hacer una especie de escalera de color, en la que los tonos más claros que el tono base van a llevar una numeración ordenada menor a 500, y los más oscuros, por encima de 500.
Así, vamos a reconocer rápidamente en que rango de colores nor vamos a estar moviendo, y en que posición esta cada color con respecto a cada luminosidad. Esto también es muy útil cuando estemos trabajando con paletas monocromáticas grises. Ahora ya podemos definir todos los colores intermedios de forma sencilla y rápida.
Conclusiones
Como hemos dicho, usar una nomenclatura en nuestras paletas de color no solo nos permite trabajar mejor en equipo y que todos los miembros tengan un denominador común al momento de nombrar colores. También si trabajamos en solitario nos va a permitir tener ciertos hábitos para mantenerlos en todos nuestros proyectos.
Por supuesto, es uso de estas nomenclaturas de colores no es única, y debemos adoptar la que mejor se adapte a nosotros o a nuestro entorno de trabajo. Debemos elegir una con la que nos sintamos cómodos, y que nos sean más confortables de utilizar que códigos de color puros y duros.