Skip to content
SPECIFICTION
Get listed

ColorDesigner vs Leonardo

ColorDesigner

colordesigner.io

Leonardo

leonardocolor.io

Side by side

FigureColorDesignerLeonardo
Price from$3.10/moFree
Free planYesYes
Free trialYes—
Open source——
WebYesYes
API—Yes
Plans published21
Spec score · Color Palette Generators8.2 (#5)7.5 (#16)

Plans

ColorDesigner

  • FreeFree
  • Pro$37.20 a year

ColorDesigner pricing →

Leonardo

  • Free / open sourceFree

Leonardo pricing →

In their own words

ColorDesigner

ColorDesigner is a web and extension platform for creating color wheels, palettes, and gradients. Its listed 13 tools include a palette builder, gradient generator, color mixer, color wheel, converter, image palette extraction, image color picking, contrast checker, and color comparison. The palette builder creates tints, shades, tones, and complementary, analogous, split-complementary, triadic, and tetradic harmonies. The Free plan costs nothing and includes 12 tools, HEX export, up to five saved colors, five palettes, and one project. Pro is $37.20 a year, billed annually, excluding tax; it adds unlimited saved colors, palettes, and projects, plus export in HEX, RGB, HSL, LAB, LCH, OKLAB, and OKLCH. Subscription plans include a 14-day free trial; the one-time payment option has no trial. The Figma plugin creates tints, shades, harmonies, and stepped gradients from selected layers or local styles, but supports solid fills only. The Photoshop extension includes a color wheel, OKLCH support, harmonies, and stepped gradients with hue interpolation across color spaces.

Visit colordesigner.io

Leonardo

Leonardo is an open-source tool for creating, managing, and sharing accessible color systems for interface design and data visualization. Users can generate swatches from target contrast ratios or set target lightness, then adjust brightness, contrast, and saturation with adaptive themes. Sequential and diverging scales support data visualization. Accessibility tools can cycle through colorblind-safe palettes and compare color differences across color vision deficiency types, while charts and 3D models help evaluate themes. Themes and scales can be downloaded as SVG, and scales can also be exported as Tableau XML. Developer output includes parameters for @adobe/leonardo-contrast-colors, CSS custom properties, and design tokens. The related JavaScript package generates adaptive contrast-based colors and is installed with npm; its documentation includes vanilla JavaScript and React examples. The site also documents an MCP server for generating themes, checking contrast, converting colors, and creating palettes. The project is licensed under Apache V2 and has a free plan listed at free. One limitation is that generated contrast ratios can be slightly above requested values because RGB colors and color-space interpolation constrain exact results.

Visit leonardocolor.io