1
Sube una imagen
Suelta, elige o pega una imagen. La herramienta la reduce localmente y extrae candidatos adecuados para UI con cuantización Celebi y ordenación Score.
DEVELOP.09 MATERIAL COLOR
Paleta Monet
Sube una imagen y genera temas dinámicos con Material Color Utilities oficial. Compara variantes, modos claro y oscuro, roles semánticos y paletas tonales completas.
IMG
Suelta una imagen aquí
o haz clic para elegir · también puedes pegarla
JPG, PNG, WebP, GIF · procesamiento local Colores fuente candidatos Elige un color como semilla del tema
CFG
Configuración del tema
Solo local
Sube una imagen para generar un tema
Extraeremos candidatos locales y construiremos un sistema de color Material completo, listo para usar en una interfaz.
UI
Vista previa del tema en contexto
§ 01
Cómo generar un tema Material desde una imagen
2
Compara variantes
Elige la especificación Material 3 o Material 3 Expressive y compara variantes con la misma vista de interfaz, color fuente y nivel de contraste.
3
Inspecciona y exporta
Comprueba juntos los temas claro y oscuro, revisa roles semánticos y paletas completas y exporta propiedades CSS o JSON.
§ 02
9 estilos de color dinámico Material
Monochrome / Neutral
Esquemas acromáticos y de baja cromaticidad para interfaces tranquilas y cargadas de contenido.
Tonal Spot / Vibrant
El equilibrado estilo Material 3 por defecto y una interpretación más colorida y energética.
Expressive / Rainbow / Fruit Salad
Rotaciones marcadas del tono aportan personalidad a productos de marca y propuestas lúdicas.
Fidelity / Content
Conservan mejor el color fuente y sus relaciones de temperatura cuando el contenido debe llevar la iniciativa.
§ 03
Una vista de color pensada para interfaces reales
✳
Cada variante usa la misma huella de cinco colores para comparar directamente primario, secundario, terciario, superficie y error.
✳
Los temas claro y oscuro aparecen juntos para revisar superficies, texto, botones, contenedores y navegación.
✳
Se muestran los 13 tonos de las paletas primary, secondary, tertiary, neutral, neutral variant y error.
✳
Utiliza Google Material Color Utilities oficial y procesa todo localmente.
§ 04
Preguntas frecuentes
Q1¿Qué es Monet?
Monet es un nombre habitual para el sistema de color dinámico de Android. No copia sin más los colores de una imagen: selecciona un color fuente adecuado y crea un tema completo con contraste en el espacio de color HCT.
Q2¿En qué se diferencian Material 3 y M3 Expressive?
Material 3 usa la especificación de color dinámico de 2021 y ofrece 9 variantes clásicas. M3 Expressive usa la de 2025; la biblioteca oficial incorpora nuevas reglas para Neutral, Tonal Spot, Vibrant y Expressive, con diferencias según el dispositivo.
Q3¿Por qué las variantes pueden verse tan distintas con el mismo color?
Cada variante aplica rotaciones de tono y objetivos de cromaticidad distintos a las paletas primaria, secundaria, terciaria y neutral. Neutral es contenida, Vibrant aumenta la cromaticidad, Expressive rota el tono y Fidelity conserva el aspecto fuente.
Q4¿Se sube mi imagen?
No. La decodificación, el redimensionado, la cuantización de píxeles, la generación y la exportación ocurren en el navegador. La imagen no sale de tu dispositivo.