Leonardo
Adobe's web tool for generating accessible color themes and scales from target contrast ratios.
These buttons open the developer's own site, repository or store listing in a new tab. wares.gg does not host downloads.
About Leonardo
Leonardo builds color systems for interface design and data visualization. You set target contrast ratios and it generates the swatches that meet them, so you do not have to check contrast by hand. You can also define swatches by target lightness. Adaptive themes let you change brightness, contrast and saturation across a whole theme, which makes it quick to produce a dark mode.
Scales can be built in several color spaces for perceptually balanced results, and charts and 3D models help you evaluate them. Output includes SVG files, CSS custom properties, Design Tokens and parameters for the @adobe/leonardo-contrast-colors package.
Strengths
- Generates swatches from target contrast ratios
- Adaptive themes make dark mode variants quick
- Exports CSS custom properties, Design Tokens and SVG
- Separate tools for data visualization scales
Limitations
- Aimed at design systems work, more than a simple palette picker needs
- Contrast-driven approach takes some learning
Details
- Pricing
- FreeFree to use in the browser, with source published on GitHub.
- License
- Open source, license not stated
- Developer
- Adobe
- Platforms
- Web
- How it runs
- Web application
- Best suited for
- Designers and developers building accessible color systems for interfaces and charts
- Categories
- Color tools, Developer tools
- Last verified
- Added
- Provenance
- Facts checked against the developer's own pages and store listings, 1 sources on file.
Alternatives to Leonardo
Compare allSoftware that can replace Leonardo for an important use case, and what changes if you switch.
Accessible Palette
A web tool for building color systems with consistent lightness and WCAG contrast across hues.
Accessible Palette builds multi-hue systems with consistent LCh lightness and shows WCAG 2 and 3 contrast, but it is not open source and export options are not described.
Huetone
An open-source web tool for building predictable, accessible color palettes in the LCH color space.
Huetone is an open-source web tool that builds accessible palettes in the LCH color space, working from perceptual lightness rather than target contrast ratios.
ColorBox
A web tool for building accessible color scales from adjustable hue, saturation and brightness curves.
ColorBox builds accessible scales from hue, saturation and brightness curves with contrast ratios per step, exporting to Tailwind CSS, OKLCH and Swift, and is not open source.
Geenes
A browser tool for building color scales and exporting them to Sketch or code.
Geenes builds color scales from hue and saturation curves and exports to Sketch or code, but has little public documentation and no contrast-ratio targeting described.
tints.dev
A web palette generator and API that builds 11-shade Tailwind CSS color scales from one base color.
tints.dev builds 11-shade Tailwind CSS scales from one base color with an API, focusing on Tailwind conventions rather than contrast targets.
UI Colors
A web tool that generates Tailwind CSS color shade scales from a base color and previews them.
UI Colors generates Tailwind shade scales with neutral and status colors and UI previews, and is freemium rather than free and open source.
Scale
A web tool that generates a smooth color scale from a single base color.
Scale generates a tint and shade scale from one base color with adjustable hue and saturation curves, but offers no contrast-driven generation or theme exports.
Atmos
A web-based color palette generator for UI designers, with shade scales and accessibility checks.
Atmos is a freemium palette generator for UI designers with shade scales, semantic status colors and accessibility checks, where some features may need an account.
Leonardo as an alternative
Listings that name Leonardo as an alternative.
Chroma.js Color Palette Helper
A web tool for designing perceptually balanced, colorblind-safe palettes for data visualization.
Leonardo is open source and includes separate data visualization scale tools alongside contrast-based UI themes, with exports to CSS, Design Tokens and SVG.
ColorBrewer
A web tool for choosing sequential, diverging and qualitative color schemes for maps and charts.
Leonardo is also open source and offers data visualization scale tools built from contrast targets, aimed more at design systems than cartography.
Data Color Picker
A web tool that builds visually equidistant color palettes for charts, maps and dashboards.
Leonardo is Adobe's open-source tool with separate data visualization scale tools, driven by target contrast ratios, with CSS and SVG export.
HCL Wizard
Web tools for designing HCL-based color palettes and checking them for color vision deficiencies.
Leonardo is open source and includes data visualization scale tools driven by target contrast ratios, aimed mainly at design systems.
iWantHue
A web tool that generates palettes of clearly distinct colors for data visualization.
Leonardo is open source and includes data visualization scale tools driven by target contrast ratios, with CSS and SVG export.
Material Theme Builder
Google's web tool for generating Material Design 3 color schemes from a source color.
Leonardo is open source and generates themes from target contrast ratios with adaptive dark mode and Design Token export, not tied to Material Design.
Viz Palette
A web tool for testing data visualization color palettes, including color vision deficiency simulation.
Leonardo is open source with separate data visualization scale tools driven by target contrast ratios, though it is aimed more at design system work.
Similar software
Related functionality, not necessarily a direct replacement.
WebAIM Contrast Checker
An online checker that tests foreground and background color contrast against WCAG AA and AAA levels.
Contrast Finder
A web tool that checks color contrast against WCAG and suggests close valid color pairs.
Realtime Colors
A web tool that previews a color palette and font pairing on a realistic page layout as you edit it.
