Getting a Colour Scheme from an Image

Extracting a Colour Scheme from an Image in C#

Learn how to programmatically extract a dominant color palette or scheme from any given image using C# and common image processing techniques.

Extracting a color scheme from an image is a common task in various applications, from dynamic UI theming to content analysis and design tools. This article will guide you through the process of identifying the most prominent colors within an image using C#. We'll cover the basic principles, necessary libraries, and provide a practical code example to get you started.

Understanding the Process

The core idea behind extracting a color scheme involves analyzing the pixel data of an image, identifying frequently occurring colors, and then often reducing this set to a manageable palette. A common approach is to quantize the colors, meaning grouping similar colors together. One effective algorithm for this is K-Means clustering, which groups pixels into 'k' clusters based on their color similarity. The centroid of each cluster then represents a dominant color.

flowchart TD
    A[Load Image] --> B{Access Pixel Data}
    B --> C[Iterate Pixels]
    C --> D{Extract RGB Values}
    D --> E[Store Colors]
    E --> F{Apply Color Quantization/Clustering}
    F --> G[Select Dominant Colors]
    G --> H[Return Color Scheme]

High-level process for extracting a color scheme from an image.

Prerequisites and Setup

To implement this in C#, you'll need a way to load and manipulate image data. The System.Drawing namespace (part of System.Drawing.Common NuGet package for .NET Core/5+) provides basic image handling capabilities. For more advanced color quantization, you might consider external libraries, but for simplicity, we'll demonstrate a basic frequency-based approach first, which can be extended with more sophisticated algorithms like K-Means.

Implementing a Basic Color Extractor

Our basic approach will involve iterating through each pixel of the image, counting the occurrences of each color, and then sorting them by frequency. We'll then select the top 'N' most frequent colors. This method is straightforward but might not always yield perceptually distinct colors if many shades of a single color are present.

using System;
using System.Collections.Generic;
using System.Drawing;
using System.Linq;

public class ColorExtractor
{
    public static List<Color> GetColorScheme(string imagePath, int numberOfColors)
    {
        if (!System.IO.File.Exists(imagePath))
        {
            throw new System.IO.FileNotFoundException("Image file not found.", imagePath);
        }

        Bitmap bitmap = null;
        try
        {
            bitmap = new Bitmap(imagePath);
            Dictionary<Color, int> colorCounts = new Dictionary<Color, int>();

            for (int x = 0; x < bitmap.Width; x++)
            {
                for (int y = 0; y < bitmap.Height; y++)
                {
                    Color pixelColor = bitmap.GetPixel(x, y);
                    // Ignore alpha channel for simplicity, or handle as needed
                    Color opaqueColor = Color.FromArgb(255, pixelColor.R, pixelColor.G, pixelColor.B);

                    if (colorCounts.ContainsKey(opaqueColor))
                    {
                        colorCounts[opaqueColor]++;
                    }
                    else
                    {
                        colorCounts.Add(opaqueColor, 1);
                    }
                }
            }

            // Sort colors by frequency in descending order
            var sortedColors = colorCounts.OrderByDescending(pair => pair.Value)
                                          .Select(pair => pair.Key)
                                          .Take(numberOfColors)
                                          .ToList();

            return sortedColors;
        }
        catch (Exception ex)
        {
            Console.WriteLine($"Error processing image: {ex.Message}");
            return new List<Color>();
        }
        finally
        {
            bitmap?.Dispose(); // Release image resources
        }
    }

    public static void Main(string[] args)
    {
        string imageFile = "path/to/your/image.jpg"; // Replace with your image path
        int colorsToExtract = 5;

        try
        {
            List<Color> scheme = GetColorScheme(imageFile, colorsToExtract);

            if (scheme.Any())
            {
                Console.WriteLine($"Extracted color scheme ({scheme.Count} colors):");
                foreach (Color c in scheme)
                {
                    Console.WriteLine($"  RGB: ({c.R}, {c.G}, {c.B}) - Hex: #{c.R:X2}{c.G:X2}{c.B:X2}");
                }
            }
            else
            {
                Console.WriteLine("No colors could be extracted.");
            }
        }
        catch (Exception ex)
        {
            Console.WriteLine($"An error occurred: {ex.Message}");
        }
    }
}

C# code to extract a basic color scheme by frequency.

Enhancing Color Extraction with Quantization

While the frequency-based method is simple, it often results in many similar colors. To get a more distinct and representative palette, color quantization algorithms like K-Means clustering are preferred. These algorithms group similar colors into 'k' clusters, and the average color of each cluster becomes part of your scheme. Implementing K-Means from scratch is complex, but many libraries provide this functionality.

K-Means clustering groups similar colors to form a distinct palette.

For a more advanced solution, you would integrate a K-Means implementation. The general steps would be:

1. Load the image and extract all pixel colors (e.g., as R, G, B vectors).
2. Feed these color vectors into a K-Means algorithm, specifying the desired number of clusters (e.g., 5-10).
3. The K-Means algorithm will return 'k' centroids, which are your dominant colors.

This approach provides a more perceptually uniform color scheme, as it actively seeks to find distinct color groups rather than just the most frequent exact matches.