What is the difference between tints and shades?

Tints are created by mixing a color with white — lightening it. Shades are created by mixing with black — darkening it. Together they form the complete lightness range of a hue.

Does my color data leave my device?

No. All calculations run in JavaScript inside your browser. Nothing is sent to any server.

Does it work on mobile?

Yes. The tool is mobile-first and works on iPhone Safari and Android Chrome.

ティント＆シェードジェネレーター

任意のベースカラーから明るいティントと暗いシェードのフルレンジを生成します。

Base color

Tints (+ white)

Base

Shades (+ black)

How to use

Click the color swatch or type a hex code to set the base color.
Tints (lighter) appear above, shades (darker) below.
Click any color block's hex label to copy it.

Related color tools

Color Mixer — blend any two colors at any ratio
Analogous Colors Generator — similar hue palette
HEX to HSL Converter — understand lightness values

よくある質問

What is the difference between tints and shades?: Tints are created by mixing a color with white — lightening it. Shades are created by mixing with black — darkening it. Together they form the complete lightness range of a hue.
Does my color data leave my device?: No. All calculations run in JavaScript inside your browser. Nothing is sent to any server.
Does it work on mobile?: Yes. The tool is mobile-first and works on iPhone Safari and Android Chrome.

Last updated: 2026-05-20 By jarvisbox