Generador de tonos y matices
Un color de entrada. Una escala tonal completa de salida. Interpolada perceptivamente para que la franja mantenga el mismo tono de extremo a extremo.
Escala tonal
Matices (más claros)
Tonos (más oscuros)
Matices, tonos y tonalidades
- Matiz — color base + blanco. Más claro, a menudo ligeramente menos saturado. Útil para fondos hover, estados deshabilitados y superficies de "capa sutil".
- Tono — color base + negro. Más oscuro, a menudo visualmente más saturado. Útil para estados hover sobre fondos claros, botones presionados y texto de alto énfasis.
- Tonalidad — color base + gris. Misma luminosidad, menos saturación. No se genera aquí; útil sobre todo para estados de UI "apagados".
La interpolación se hace en el espacio OKLab en lugar de RGB, así que el tono se mantiene perceptivamente constante a lo largo de la franja — un azul sigue siendo reconociblemente azul a lo largo de todos sus matices, en lugar de derivar por tonos rosados como hacen las escalas interpoladas en RGB.