1. INTRODUCTION
Here at Research and Practice in Thrombosis and Haemostasis (RPTH), we emphasize use of images including color to tell the story of science.1 A major advantage of open access publication is that it allows readers quick and free access to the entirety of an article and not simply the abstract, with the rest hidden behind a paywall. We find that we most often jump straight to the figures when attempting to understand the critical points of a manuscript. An advantage of a digital journal is the ability to include colorful figures without the encumbrance of color publication charges. Good figure design can facilitate study interpretation; optimizing color choice leads to better figures and can help improve readability. One simple strategy in color selection is to use a single color (eg, blue) and pair it with different swatches of that color (eg, navy blue and sky blue). An alternative approach is to draw from graphic design practice and choose several related colors from across the spectrum. Here, we offer practical considerations for multiple color palette selection for use in figures.
2. INCORPORATING COLOR THEORY INTO COLOR SELECTION
Much like researchers draw on established biological models for crafting experiments, graphic designers leverage existing patterns when selecting colors for images. Color theory is the body of practical considerations that drive the development of contemporary color combinations in a palette.2 Color models are tools central to color theory that define the color spectrum based on presence or absence of a few primary colors. These models specify colors with commonly used mathematical notation, and modern graphical programs use these notations to render images. We think that understanding the fundamentals of color theory, how to identify color palettes from a color wheel, and how to specify desired colors with simple notation will help promote development of more visually appealing figures.
2.1. Red green blue additive color model
In a digital journal like RPTH, images appear on a computer, tablet, or phone screen and are not usually printed on paper. We recommend use of the RGB color model because it mimics how these modern digital displays function. The 3 primary colors of the RGB model are red, green, and blue, which are also the colors incorporated in each pixel of a computer screen. The RGB color model is additive, meaning that combining primary colors will increase the lightness (ie, closer to white) of the blended color. Similarly, individual pixels on a computer screen appear with greater illumination of the red, green, and blue components. The eye will perceive fully illuminated red, green, and blue pixels as white.
2.2. Triplet and hexadecimal red‐green‐blue notation
RGB notation specifies the amount of red, green, and blue to blend when rendering a specific color, and allows 16.8 million possible colors. Numeric triplet notation expresses each possible color by defining the relative contribution of each primary color on a range from 0 (absence of color) to 255 (full color). For example, red is “255, 0, 0,” yellow is “0, 255, 0,” blue is “0, 0, 255,” white is “255, 255, 255,” and black is “0, 0, 0.” This can also be expressed as a hexadecimal. This base 16 (0, 1, 2, 3, 4, 5, 6, 7, 8, 9, A, B, C, D, E, and F), 6‐character‐long code conventionally follows a leading pound symbol. Because of the properties of base 16, the hexadecimal for the base 10 number 255 is notated as FF. Red, blue, and green each constitute 2 consecutive characters. Because of this, red is “#FF0000,” green is “#00FF00,” blue is “#0000FF,” white is “#FFFFFF,” and black is “#000000.” Modern graphical programs variably use triplet or hexadecimal variants when selecting individual colors.
2.3. Be aware of red yellow blue and cyan magenta yellow black subtractive color models
In contrast to additive models, subtractive color models consider blended colors as darker. You might come across 2 common subtractive color models, and we present them here to prevent any confusion. First, the red yellow blue (RYB) color model considers yellow as a primary color rather than green. The RYB model is commonly incorporated in early education, which is why school children learn that green is a combination of blue and yellow, purple is a combination of blue and red, and orange is a combination of red and yellow. RYB notation is identical to RGB notation but the codes cannot be used interchangeably. Second, print media uses the cyan magenta yellow black (CMYK) color model. This specifies 4 primary colors and has a quadruplet notation (eg, cyan is “255, 0, 0, 0”).
2.4. The RGB color wheel
Color wheels are used to aid understanding of the relationship of colors to each other and can help guide selection of color palettes. Figure 1 depicts a simplified 12‐color RGB color wheel and RGB notation for each color. The 3 primary colors are indicated by the points of the inner triangle. Triplet and hexadecimal notation are adjacent to each color.
Figure 1.
12‐color red green blue (RGB) wheel plus RGB notation for individual colors
The selection of a palette for a figure is based on personal preference, and a color wheel can guide selection of color combinations based on the interrelationship of the colors within the wheel. This is illustrated for the RGB color wheel in Figure 2. These relationships are commonly incorporated in artwork and graphics design. Though you might not have heard of these color patterns before, they will seem familiar given their frequent use in Western media.
Figure 2.
Color combinations
Complementary colors are 2 colors opposite each other on the color wheel (eg, A & G). Analogous colors are adjacent to each other (eg, A, B, & C). Triad colors are 3 colors that are evenly spaced (eg, A, E, & I), and square colors are 4 evenly spaced colors (eg, A, D, G, & J). Split complementary colors are 2 colors adjacent to a color's complementary color (eg, H, A, & C). Double complementary or tetrad colors are 2 separate complementary color matches on a color wheel (eg, A, G, C, & I).
A color wheel with only 12 colors provides limited options. We suggest authors use an online color wheel incorporating all possible RGB colors when developing a palette for figures. Numerous online tools exist; we like the Color Supply app (https://colorsupplyyy.com/app), Sessions College for Professional Design Color Calculator (https://www.sessions.edu/color-calculator/), and Rapid Tables Color Wheel (https://www.rapidtables.com/web/color/color-wheel.html).
3. SELECTING COLORS WITHOUT A COLOR WHEEL
3.1. The RPTH palette
The International Society on Thrombosis and Haemostasis and RPTH color selections appear in Table 1. If you are struggling with choosing a palette for a figure, consider incorporating 1 or more of these colors in submissions to RPTH. Of note, this palette was chosen by graphic designers without following the consistent patterns above on the color wheel.
Table 1.
Research and Practice in Thrombosis and Haemostasis palette
Color name | Color | RGB Triplet | RGB Hexadecimal |
---|---|---|---|
RPTH Blue | (0, 45, 106) | #003366 | |
RPTH Red | (227, 27, 35) | #E31B23 | |
RPTH Medium Blue | (0, 92, 171) | #005CAB | |
RPTH Light Blue | (220, 238, 243) | #DCEEF3 | |
RPTH Accent Yellow | (255, 195, 37) | #FFC325 | |
RPTH Cool Gray | (230, 241, 238) | #E6F1EE |
3.2. Cartography color selection
Cartographers have similar challenges when selecting colors for adjacent areas. A popular website to guide color selection for map makers is ColorBrewer (http://colorbrewer2.org/). We find this website to be intuitive and simple to use when selecting color palettes to be used in scientific figures.
4. SPECIFYING COLORS IN GRAPHICAL SOFTWARE
Modern graphical programs allow for color selection using RGB notation. Examples are included in Table 2.
Table 2.
Selecting colors within figure‐producing software
Program | RGB notation | How to delineate | Example |
---|---|---|---|
Stata | Triad | Place the triad in quotations in parentheses without commas | …fcolor(“255 0 0”) |
SAS | Hexadecimal | Lead the hexadecimal code with “cx” and no pound sign | …color = cxFF0000 |
R (ggplot2) | Hexadecimal | Use a leading pound sign and quotations | …fill=“#FF0000” |
Microsoft Excel, PowerPoint, Word | Triad | When selecting a color, select “More Colors” →“Custom”; then enter values for the RGB triad in the text boxes |
5. ACCESSIBILITY FOR THE COLORBLIND
Readers with colorblindness may have difficulty distinguishing between different colors with low contrast, creating significant issues in distinguishing groups depending on legends. We encourage development of figures that consider accessibility of the colorblind.
One approach to this is to develop figures that do not depend on colors only to delineate between groups. Judicious use of labels, differing fill patterns, or differing shape outline patterns can help delineate between groups. For example, for line graphs, use of 1 solid and 1 dashed line, even when they are different colors, is helpful. Another solution is to choose colors with widely different levels of lightness in order to increase the contrast. For example, RPTH Red and Blue have a similar degree of lightness and therefore very little contrast (Figure 3). RPTH Medium Blue and Light Blue differ greatly in their lightness and have a wide contrast. These latter colors can be distinguished from each other regardless of the type of color blindness, as can easily be seen rendering (or printing out) the figure in grayscale. Online tools can help identify color combinations with high contrast. We like Web Accessibility in Mind's Contrast Checker (https://webaim.org/resources/contrastchecker/) and Acart's Contrast Checker (https://contrastchecker.com/). ColorBrewer (http://colorbrewer2.org/) simplifies selection of colors with its integrated "Colorblind Safe" option.
Figure 3.
Low‐ and high‐lightness contrast schemes
6. CONCLUSION
High‐quality figures play a critical role in exchanging scientific concepts. At RPTH, we encourage use of color figures. Key considerations are shown in the box. This editorial does not cover tips for micrograph images, which have similar considerations.3 Selecting optimal color palettes can improve the appearance and readability of figures.
Color Palette Use in Figures |
---|
|
Contributor Information
Timothy B. Plante, https://twitter.com/tbplante.
Mary Cushman, https://twitter.com/MaryCushmanMD.
REFERENCES
- 1. Wolberg AS, Cushman M. Illustrated review article: A new format for disseminating scientific progress. Res Pract Thromb Haemost. 2018;2:405–6. [DOI] [PMC free article] [PubMed] [Google Scholar]
- 2. Fraser P. How color works: color theory in the 21st century. New York, NY: Oxford University Press, 2018. [Google Scholar]
- 3. Levine T. Using colour in figures: let's agree to differ. Traffic. 2009;10:344–7. [DOI] [PMC free article] [PubMed] [Google Scholar]