ColorAssembly
Use cases

Data Visualization Colors

Generate distinguishable colors for charts and graphs

Create color palettes optimized for data visualization.

Generate Distinguishable Colors

import { loadColorAssembly } from '@cymbol/colorassembly';
 
const api = await loadColorAssembly();
 
// Generate colors for chart
function generateChartColors(count: number) {
  const baseColor = { r: 59, g: 130, b: 246 };
  return api.generate.hueVariations(baseColor, count, 360 / count);
}
 
const chartColors = generateChartColors(8);
// Returns 8 evenly spaced colors around the color wheel

Ensure Color Blind Safety

function generateSafeColors(base: RGB, count: number) {
  const colors: RGB[] = [base];
  
  while (colors.length < count) {
    const candidate = api.generate.adjustHue(
      base,
      (360 / count) * colors.length
    );
    
    // Check if distinguishable for color blind users
    const isSafe = colors.every((existing) =>
      api.analyze.isSafeForColorBlind(candidate, existing)
    );
    
    if (isSafe) {
      colors.push(candidate);
    }
  }
  
  return colors;
}

On this page