Color is a phenomenon that diverse fields — physics, biology, perception phenomena, psychology, symbolism, sociology, art, communication, and industry — are concerned with. However, what makes the study and understanding of color as a phenomenon even more complicated is that its meaning can vary enormously in differing cultural contexts.
Getting the meaning right can determine the success or failure of a business product. An interesting example of this is mentioned by Michel Pastoureau. Invited to provide an introductory essay in The Color Compendium (1989), he writes that in the late 80s, Canon, Nikon and Fuji launched a range of disposable cameras in three colors — yellow, blue and red. The product was a success in Europe and the United States, but failed in Japan.
In the essay, Pastoureau explains that across Northern America, Western, and Eastern Europe there is a strong preference for blue as the favorite color followed by green. The only country that’s different is Spain where red is preferred, followed by blue, then yellow. Differing results are seen in South America too, with Peruvians preferring red.
In Japan, Pastoureau states that white is the number one choice representing 40 percent of the population with black in second with 20 percent. According to him, the colored disposable cameras were not popular in Japan because people there expected their cameras to be black.
This illustrates the importance of knowing the cultural associations around a color because the market for a product differs enormously depending on its unique audience. In this article, you’ll learn more about color language and the role it plays in UX design.
A search for “color and UX” on Google returns any number of well-written and informative resources. These entries generally begin by highlighting the central importance of color in design and go on to explain the basic fundamentals of color theory (especially, the concepts of hue, saturation, and brightness).
After an introduction to the concept of variance within a shade of color, these entries then examine how different colors are organized through logical systems represented by geometric diagrams such as the color wheel, hierarchical systems such as the primary, secondary and tertiary color, or, additive and subtractive systems such as the RGB and the CMYK systems.
Understanding these systems can help you generate and employ complementary color palettes, but also ensure you understand how your color choices will be replicated and rendered on screens or in print.
After setting out the theoretical aspects, the typical entry attempts to explain the more ephemeral attributes of color, such as mood and psychology. Here you’re informed, for example, that red is associated with passion, orange with sociability, yellow with warmth, green with nature, blue with competence, pink with compassion, purple with royalty, brown with ruggedness, black with security or white with cleanliness.
All of this comes from the right intentions, but color isn’t as simple as a one-size-fits-all approach that you can apply across the board. Individual cultures shift the perception of colors and as a UX designer you need to be careful about extrapolating out a framework geared towards a largely North American context.
For the longest time, I treated Western color theory as a type of gospel. However, studying anthropology (almost a decade and a half ago as part of a postgraduate master’s degree) taught me to be skeptical of such systems. As Wendy Doniger mentions, facts on closer examination often turn out to be an interpretation. Yet, I had no idea researching the relationship between color and culture would turn everything I thought I knew about the science of color on its head.
A germ of doubt was planted by a guest lecture delivered by an academic named Dr. Sadan Jha that I attended when I was at university. In fact, it was this lecture that served as an introduction to Michel Pastoureau. In my head, I thought of Dr. Jha’s lecture was regarding Indian politics and culture, rather than the general methodology of anthropology and cultural analysis.
Oddly, it’s only now, while writing this, after studying and applying color theory as an artist and designer that I comprehend much better what color reveals about the academic field of anthropology. Dr. Jha’s lecture about saffron left me with a question: How does a hue—any shade for that matter— become fixed as a color through an industrial process?
At the time, Dr. Jha was on a visiting scholarship, working on a paper that was eventually published in The Indian Economic and Social History Review as “Challenges in the history of colours: The case of saffron”. Saffron, today, occupies an important place in the politics of modern India. For instance, while traditionally the Indian cricket team wore blue for the shorter format of the game, players are now seen in a redolent kit of fluorescent orange (that many interpret to be saffron).
What blew my mind about Dr. Sadan Jha’s lecture was how he showed that until saffron was co-opted as a metaphor for the concept of India’s antiquity, the color was unfixed and understood to be a shade that could be orange, red, or yellow. These warm colors are all traditionally considered holy in Hinduism, Buddhism, and Sikhism, but until they acquired a certain political meaning, they were variable, unfixed hues that were quite pale.
In his paper, Dr. Jha traces the emergence of saffron as a color of national importance in Indian politics to the late 1920s. Politicians like Jawaharlal Nehru and Suniti Kumar Chatterji recognised it as an “old color” which was symbolic of “Indian life.” Thus, the hue was elevated from a “kacha” color (“kacha” means unfixed or impermanent) which was once derived from mixing the stem of the saffron flower with turmeric and milk (a highly nutritious beverage with proven medicinal properties).
Association of saffron with Hinduism has led to the marginalizing of red in religious identity. Jha argues that regional usages and meanings of unfixed hues known by names such as, “geru, kesari, or kusumba” only came to denote a well defined shade of saffron in the second half of the 1920s. It’s this shade of red-orange that has come to occupy such an important place in the national imagination of Indian history.
Writing this, I also began to think about my childhood obsession of keeping my colored pencils in the same order that they came in from the manufacturer (a Staedlter box of 12 from Germany). This box of colored pencils was one of my most precious possessions as a child. The pencils came arranged starting with a whitish peach on the extreme left and black on the extreme right.
After the white/peach on the left, were the warms: Yellow, orange, red, and scarlett. Then, came purple, dark blue, light blue, light green, dark green, brown, and black. Trying to stick to this arrangement was probably my first introduction to a color system:
According to Colorhexa.com, the color “deep saffron” is described as:
“In a RGB color space, hex #ff9933 (also known as Deep saffron) is composed of 100 percent red, 60 percent green and 20 percent blue. Whereas in a CMYK color space, it is composed of 0 percent cyan, 40 percent magenta, 80 percent yellow and 0 percent black. It has a hue angle of 30 degrees, a saturation of 100 percent and a lightness of 60 percent. #ff9933 color hex could be obtained by blending #ffff66 with #ff3300. #ff9933 (or #f93) is a websafe color.”
Note the various differing ways the same color is expressed:
Ben Gremillion, who provides an excellent overview of the hexadecimal color system, writes:
“When computers name a color, they use a so-called hexadecimal code that most humans gloss over: 24-bit colors. That is, 16,777,216 unique combinations of exactly six characters made from ten numerals and six letters — preceded by a hash mark. Like any computer language, there’s a logical system at play. Designers who understand how hex colors work can treat them as tools rather than mysteries.”
So, how can the syntax be used to generate a color? The first two spaces control red, the next two control green and the last two control blue. The value range is 0 for the lowest and f as the highest. So deep saffron has the highest possible value for red (ff), a middling value of green (99), and a low value for blue (33). You’ve heard of paint by numbers. Learning this system allows you to paint with numbers:
One way the RGB system is often explained is linked to the pixel (which is made of red, green and blue light). Like the extreme left of my childhood color pencil box’s range, when all three components of a pixel are on, the pixel is white. When they’re off — the extreme right of my colored pencil box — the pixel is black.
In between, there’s the rainbow range of colors, generated through a percentage combination of the component red-green-blue colors. This system may seem like a modern marvel, but in reality, digital technology is built upon principles of color that have been known to artists and scientists for centuries.
The RGB system is based on the “trichromatic vision theory” or the Young-Helmholtz theory. The theory is derived from the independent work of Thomas Young (1773-1829) and Hermann von Helmholtz (1821-1894). In a nutshell, it was propounded that the human vision system possesses three types of photoreceptors: Short-preferring (violet), middle-preferring (green), and long-preferring (red) and that color is perceived by a proportional activation of these receptors.
The CYMK system, which is intended for print, can be traced to William Henry Perkin (1838 to 1907), who in an attempt to synthesize quinine, ended up discovering a chemical that could be used as an artificial purple dye (that came to be known as “aniline purple”).
The truth is that there are actually hundreds of scientists who worked to develop the academic science of color theory. However, Isaac Newton’s famous prism experiment in 1666, which split a beam of light into its constituent spectrum of color is probably the foundational keystone of Western color theory.
According to this theory, there are seven basic colors: Violet, indigo, blue, green, yellow, orange and red. However, I was shocked to discover that this was all purely arbitrary categorization by Newton. Newton, who subscribed to an esoteric theory about a harmonious universe, simply assumed that color would possess a mathematical structure that corresponded to a musical structure!
So, while the spectrum is scientific fact, the decision to divide it into seven principal colors was purely arbitrary. Newton’s attempt was to associate color with the diatonic scale of music. Red was the note C, orange the note D, yellow the note E, green was F, blue, G, indigo, A and violet, B. Cultural considerations, such as the use of the circle in alchemy and the value placed on the color indigo, also seemed to have weighed on Newton’s mind.
So, who designated that dark saffron should be denoted by the hex #ff9933, rather than say the lighter #f4c430?
On one hand, one could argue that the color is identified by the internal logic of the hexadecimal number system. On the other hand, the result has been chosen purely because it just looks okay. All color systems, whether RGB, CYMK, or Pantone, are human creations. These systems work and are highly respected because of an internal logic that they possess, but there’s no perfect scientific system when it comes to affixing a shade of color.
The universalist theory of color was described by Brent Berlin and Paul Kay in the 1960s. By analyzing ninety languages and how they referred to color, the researchers were able to show some broad but surprisingly consistent rules in the evolution of color names. For instance, the most primitive languages distinguish between only black and white (or light or dark tones).
These cultures even saw the rainbow as made of three colors. If and when a third color is named, it’s invariably red. This is followed by yellow and green and blue is a surprising sixth. After this come subtle distinctions of pink, brown, and others.
The relativists, while accepting this, point out that weightage given to certain colors varies enormously across different cultures. The disproportionate importance is generally indicative of regional and local environmental factors and key to understanding cultural difference. The well-known example is that of the Eskimos who reputedly have over 100 words for ice and snow.
Dwellers of temperate regions don’t have the same need. Similarly, the hunger-gatherer tribes of the Kalihari in southern Africa have many words for green and brown, but none for blue. This is in direct contrast with the fishermen of Breton, France, who possess a plethora of words for the blues and grays of the Atlantic.
In researching localization, art history should be the first port of call for a researcher. It’s imperative to know how the dull muted palette of grays, browns, and greens that students were taught to paint in at the time of Vincent van Gogh and how that whole culture was swept away by the revolutionary experiments of Impressionism.
Typography matched with a specific color can also indicate a region or a time in history. For instance, in the 1950s, a graphic design joke went: “How do you do British post-war design?” The answer was: “Set it in Gill Sans and print it in British Racing Green.”
In February, 2015, Cecilia Bleasdale espied an attractive dress in a shop near Chester, England and took a photograph on her phone. Her daughter was getting married and she wanted an opinion on the suitability of the dress for the wedding. However, the mother and daughter couldn’t agree on what the color of the dress really was.
In the coming hours and days, almost everyone on the planet who was active on social media got pulled into the dispute: Whether the dress was blue-and-black or white-and-gold:
The curious incident of “the dress” is probably one of the most well-known examples of variance in color perception between two classes of individuals, locally as well as globally. It indicates that color perception can vary between members of the same family and across cultures in the same, universal way.
It would be a mistake to think of color as an impossible problem to solve with no effective solution. To my mind, the existence of the problem of color interpretation and variance of background indicates perfectly the importance of UX as a design discipline. On one hand, the designer must create a product distinct from others.
On the other hand, the product can’t be jarringly different that a user needs to deviate from a universal understanding of norms. Like the rules of design, some colors have universal application, while others only work in local contexts. Research and testing are crucial to identify what works and what doesn’t.
In the end, it doesn’t matter what age or culture you belong to. One of the best things you can do to understand color is break out your colored pencils, crayons, or watercolors and just play.
Scientists may say that color is made from red, yellow/green and blue, but anthropologists know that what it’s really made of is pure human joy.
Featured image source: IconScout
LogRocket lets you replay users' product experiences to visualize struggle, see issues affecting adoption, and combine qualitative and quantitative data so you can create amazing digital experiences.
See how design choices, interactions, and issues affect your users — get a demo of LogRocket today.
Search bars are more than icons and inputs — they can be a retention magnet or a churn trigger. Sharing my tried-and-tested search bar design principles in this blog!
Are your colors clashing or cohesive? In this blog, I talk about clashing colors, their impact, and how you strike the perfect balance with colors in your designs.
You know that good design is all in the details. And nicely used kerning impacts readability, user flow, and brand professionalism in your UI design — more on that in this blog.
Visual communication and UI/UX design work together to enhance user experiences. Here’s how you can balance both in your designs.