Add white to a color and you get a tint. It is lighter than the original but keeps the same hue. Pink is a tint of red. Sky blue is a tint of blue. Mint is a tint of green. Tints are one of three basic color modifications, alongside shades and tones. Where shade adds black, and tone adds gray, tint adds white.

Designers use tints to build palettes from a single hue. A website might use a deep blue for headers and a pale tint of the same blue for background panels. This creates harmony without introducing new colors. Tints also work well for hover states, disabled buttons, and subtle backgrounds. They feel airy and gentle compared with the full-strength color.

Tint vs. shade vs. tone

• Tint: color plus white, lighter.
• Shade: color plus black, darker.
• Tone: color plus gray, muted.
• Together they expand one hue into a full range.

Watercolor painters rely on tints. So do interface designers building design systems. A single hue, lightened in steps, can supply an entire screen without overwhelming the eye.