ToolSlash LogoToolSlash
Tools →

Material Color Palette Generator

Guide

Material Design 3 Tonal Palette Guide

Material Design 3 uses tonal palettes generated from a seed color to construct consistent, accessible UI color schemes.

Tonal Range

Tones: 0 (Black), 10, 20, 30, 40, 50, 60, 70, 80, 90, 95, 100 (White)
Contrast Rule: Primary text on primary container must meet WCAG 4.5:1

Frequently Asked Questions

What is a Material Design seed color?
A single key color used to derive coordinated primary, secondary, tertiary, and neutral tonal palettes.
How does Material You ensure accessibility?
Luminance tones guarantee consistent contrast ratios across light and dark themes regardless of the chosen hue.