DuckyTools
Home Color Shades and Tints Generator

Shades and Tints Generator Color

Generate a full lightness ramp from any color — perfect for design tokens.

Shades and Tints Generator is a free online tool that generate a full lightness ramp from any color — perfect for design tokens. It runs entirely in your web browser using plain JavaScript, so files are processed on your own device and never uploaded to a server. There is no sign-up, no file size limit imposed by the site, no watermark and no paid tier.

Price
Free — no account, no quota, no watermark
Category
Color
Where it runs
In your browser, on your device
Files uploaded
None
Technology
plain JavaScript
Settings
2
Works offline
Yes, after the first visit

About Shades and Tints Generator

Shades and Tints Generator is one of 14 color tools on DuckyTools, and like all of them it runs entirely inside this page. Generate a full lightness ramp from any color — perfect for design tokens.

How to use it

  1. Enter base color and steps.
  2. Results update the moment anything changes.

The 2 settings

SettingWhat it doesDefault
Base colorA color, picked from your system color picker.#FFD84D
StepsRange 3–20.10

Under the hood

Runs onplain JavaScript — runs the whole thing
ControlsBase color, Steps

Questions

What are the limits on steps?

It accepts 3 to 20, starting at 10.