Infographic Color Palettes Reference

Infographic Color Palettes Reference

This reference provides comprehensive color palette options for creating accessible, professional infographics.

Colorblind-Safe Palettes

These palettes are designed to be distinguishable by people with various forms of color vision deficiency.

Wong's Palette (7 Colors)

The most widely recommended colorblind-safe palette, developed by Bang Wong for scientific visualization.

Prompt usage:

"Use Wong's colorblind-safe palette: orange (#E69F00), sky blue (#56B4E9), 
bluish green (#009E73), and blue (#0072B2) for data categories"

IBM Colorblind-Safe Palette (8 Colors)

IBM's accessible color palette designed for data visualization.

Prompt usage:

"Use IBM colorblind-safe colors: ultramarine (#648FFF), indigo (#785EF0),
magenta (#DC267F), and gold (#FFB000) for visual elements"

Okabe-Ito Palette (8 Colors)

Developed by Masataka Okabe and Kei Ito, widely used in scientific publications.

Note: Identical to Wong's palette - both are industry standards.

Tol's Qualitative Palette (12 Colors)

Paul Tol's extended colorblind-safe palette for more categories.

Industry-Specific Palettes

Corporate/Business

Classic, professional appearance suitable for business reports and presentations.

Prompt usage:

"Corporate business color scheme: navy blue (#1E3A5F) primary, 
steel blue (#4A90A4) secondary, gold (#F5A623) accent, 
light gray background, professional clean design"

Healthcare/Medical

Trust-inducing, clinical colors appropriate for health-related content.

Prompt usage:

"Healthcare medical color scheme: medical blue (#0077B6), 
cyan (#00B4D8) accents, coral (#FF6B6B) for emphasis, 
clean clinical white background, professional medical design"

Technology/Data

Modern, tech-forward appearance, works well with dark mode.

Light Mode Alternative:

Prompt usage:

"Technology data visualization colors: deep navy (#1A1A2E) background,
electric blue (#00D9FF) and neon purple (#7B2CBF) accents,
modern tech aesthetic, futuristic design"

Nature/Environmental

Earth tones and greens for sustainability and environmental topics.

Prompt usage:

"Environmental nature color scheme: forest green (#2D6A4F),
mint (#95D5B2), earth brown (#8B4513) accents,
cream background, organic natural design feel"

Education/Academic

Friendly yet professional colors for learning content.

Prompt usage:

"Education academic color scheme: academic blue (#3D5A80),
light blue (#98C1D9), coral (#EE6C4D) highlights,
warm white background, friendly educational design"

Marketing/Creative

Bold, vibrant colors for attention-grabbing content.

Prompt usage:

"Marketing creative colors: vibrant coral (#FF6B6B), teal (#4ECDC4),
yellow (#FFE66D) accents, bold eye-catching design,
modern and energetic feel"

Finance/Investment

Conservative, trustworthy appearance for financial content.

Prompt usage:

"Finance investment color scheme: navy (#14213D), gold (#FCA311),
green (#2ECC71) for positive, red (#E74C3C) for negative,
conservative professional design, trustworthy appearance"

Creative/Design

Artistic, gradient-friendly palette for creative content.

Prompt usage:

"Creative design colors: purple (#7400B8) to cyan (#48BFE3) gradient,
pink (#F72585) accents, artistic modern style,
dark background, bold creative aesthetic"

Government/Policy

Formal, accessible colors for public sector content.

Prompt usage:

"Government policy colors: navy blue (#003366), red (#CC0000) accents,
light blue (#6699CC) secondary, formal accessible design,
high contrast for readability"

Nonprofit/Cause

Warm, human-centered colors for social impact content.

Prompt usage:

"Nonprofit cause colors: warm orange (#E07A5F), sage green (#81B29A),
sand (#F2CC8F), human-centered warm design,
cream background, impactful and welcoming"

Gradient Combinations

Pre-defined gradient combinations for modern infographics.

Sunset Gradient

Start: #FF6B6B (Coral)
Middle: #FFA07A (Light Salmon)
End: #FFD93D (Yellow)
Direction: Top to bottom or left to right

Ocean Gradient

Start: #0077B6 (Blue)
Middle: #00B4D8 (Cyan)
End: #90E0EF (Light Cyan)
Direction: Top to bottom

Forest Gradient

Start: #1B4332 (Dark Green)
Middle: #40916C (Green)
End: #95D5B2 (Mint)
Direction: Bottom to top

Purple Dream Gradient

Start: #7400B8 (Purple)
Middle: #5E60CE (Indigo)
End: #48BFE3 (Cyan)
Direction: Left to right

Warm Gold Gradient

Start: #F5A623 (Gold)
Middle: #FFC857 (Light Gold)
End: #FFE8A8 (Pale Yellow)
Direction: Top to bottom

Cool Steel Gradient

Start: #1E3A5F (Navy)
Middle: #4A90A4 (Steel Blue)
End: #A8D5E2 (Light Blue)
Direction: Left to right

Prompt usage for gradients:

"Use ocean gradient background from blue (#0077B6) to light cyan (#90E0EF),
flowing top to bottom, modern clean design"

Contrast Checking

WCAG 2.1 Requirements

Common Safe Combinations

On White Background (#FFFFFF):

On Dark Background (#1A1A2E):

Colors to Avoid Together

These combinations have poor contrast or are problematic for colorblind users:

• Red and Green (most common colorblindness)
• Blue and Purple (hard to distinguish)
• Light green and Yellow (low contrast)
• Red and Orange (similar hues)
• Blue and Gray (can be confused)
• Pink and Gray (similar values)

Quick Reference: Color Prompt Phrases

Copy-paste these phrases into your prompts:

By Mood

"Warm and inviting color palette with oranges, yellows, and cream"
"Cool professional color palette with blues, grays, and navy"
"Bold and energetic colors with bright accents on white background"
"Soft and calming pastel color scheme"
"High contrast black and white with single accent color"
"Earth tones with greens, browns, and natural colors"

By Industry

"Corporate business colors: navy, gray, gold accents"
"Healthcare professional colors: blue, teal, white, clean clinical feel"
"Technology modern colors: dark background with neon blue accents"
"Environmental green color scheme with natural earth tones"
"Educational friendly colors: blue, coral, cream, approachable design"
"Financial conservative colors: navy, gold, high trust appearance"

By Accessibility

"Colorblind-safe palette using Wong's recommended colors"
"High contrast color scheme meeting WCAG accessibility standards"
"Distinct colors that work in grayscale"
"IBM colorblind-safe palette for data visualization"
"Colors with patterns and labels for accessibility"

Testing Your Colors

Online Tools

1. Contrast Checkers:

   • WebAIM Contrast Checker: https://webaim.org/resources/contrastchecker/
   • Coolors Contrast Checker: https://coolors.co/contrast-checker

2. Colorblind Simulators:

   • Coblis: https://www.color-blindness.com/coblis-color-blindness-simulator/
   • Sim Daltonism (Mac app)
   • Color Oracle (Desktop app)

3. Palette Generators:

   • Coolors: https://coolors.co/
   • Adobe Color: https://color.adobe.com/
   • Paletton: https://paletton.com/

Quick Grayscale Test

Convert your infographic to grayscale. If all elements are still distinguishable, your color choices are accessible.

Use these palettes as starting points, adjusting as needed for your specific content and brand requirements. Always test for accessibility before finalizing.