Extrae automáticamente de 4 a 12 colores dominantes de una imagen y genera valores HEX/RGB/HSL, contraste WCAG, variables CSS, una paleta PNG y un gradiente CSS basado en los colores extraídos Solo en el navegador genera valores HEX, RGB y HSL, variables CSS y degradados.
JPG, PNG, WebP, GIF, SVG y otras imágenes que pueda leer el navegador
/* CSS aparece después de la extracción de paletas. */
Un extractor de paleta resume los píxeles muestreados; no sabe qué objeto de la fotografía es semánticamente importante. Se obtienen buenos resultados al elegir un recuento de colores, una precisión de muestreo y una referencia de contraste adecuados, y luego tratar la paleta y el degradado generados como puntos de partida del diseño en lugar de una verdad absoluta.
De cuatro a seis colores suelen producir una paleta de interfaz de usuario más clara, mientras que cantidades más grandes preservan más acentos de fotografías complejas. Si las muestras vecinas parecen casi idénticas, reduzca el número de colores o aumente la precisión del muestreo en lugar de mantener tonos redundantes.
Un muestreo más denso puede capturar pequeños acentos pero requiere más trabajo del navegador. El muestreo más rápido es apropiado para imágenes grandes o exploración rápida. Vuelva a ejecutar con una configuración más fina cuando falte un color pequeño pero importante.
Un color que parece claro en un fondo puede no tener un buen contraste en otro. Utilice la referencia de contraste como guía, luego verifique las combinaciones de texto y UI con el tamaño, el peso y el fondo reales del primer plano utilizados en el diseño final.