¿Cómo puedo eliminar los píxeles blancos alrededor de los bordes al exportar un GIF transparente?

Tomé los cargadores de xooplate.com y luego los exporté con la ayuda de la acción incluida a un GIF. Pero tengo algunos píxeles blancos alrededor del cargador que son realmente molestos cuando se muestran sobre un fondo oscuro. Puedes verlo aquí, en un cuadro que extraje del gif:

ingrese la descripción de la imagen aquí

¿Cómo puedo evitar esos píxeles blancos y mantener el fondo transparente?

Es posible que desee mencionar qué software está utilizando. Puedo asumir Photoshop, pero nunca está de más etiquetar tu pregunta correctamente y mencionar el software que estás usando.
es photoshop Estoy interesado en eliminar esos píxeles blancos, no la transparencia (KMSTR)
kontur tiene razón sobre el motivo de la aspereza (es decir, estado binario activado/desactivado de transparencia). Dependiendo del contexto, se puede hacer un poco de trampa al crear una imagen un poco más grande y casi idéntica guardada como PNG con transparencia alfa y colocarla como una imagen de fondo estática con el gif animado de bajo color centrado en ella. De esta manera, puede asegurarse de que el color mate (como se describe en la respuesta de kontur) se pueda conocer con un mayor grado de certeza.

Respuestas (2)

La forma en que funciona la transparencia con gifs/pngs de 8 bits es que un píxel es completamente transparente o completamente opaco .

En las esquinas de un círculo donde el círculo se funde de forma transparente con el fondo, normalmente hay píxeles que son semitransparentes para suavizar la transición. Esta transición suave no se puede reproducir completamente con gifs/pngs de 8 bits.

Una forma de fingir esto es seleccionar un fondo mate para todos esos píxeles semitransparentes. Esto significa que los píxeles que no son completamente transparentes obtienen su color calculado como si estuvieran encima del color mate.

Los píxeles blancos en el gif de tu círculo suceden así, porque el gif se hizo para usarse contra un fondo blanco. Los píxeles semitransparentes del círculo original se contrastaron con el color blanco mate, lo que resultó en píxeles casi blancos pero completamente opacos alrededor de las esquinas.

La forma de remediar esto si tiene el círculo original completamente transparente es save for web & devicesseleccionar un color mate que se adapte a su fondo. De esa manera, los píxeles potencialmente semitransparentes se fusionarán en píxeles completamente opacos contra el color mate y, vistos en su sitio web con un color de fondo similar, aparecerán completamente uniformes. Tenga en cuenta que a) los gráficos con rangos pequeños de áreas semitransparentes (en píxeles) funcionan mejor, y b) esto requiere que el fondo contra el que se muestra el gif sea parte del color uniforme que elija para su mate.

ingrese la descripción de la imagen aquí

En esta imagen:

  • La parte superior izquierda es el gráfico redondo original con esquinas suavizadas, es decir suavizadas.
  • El mismo resultado que obtiene con png-24, como se ve en la parte superior derecha, pero esto no funciona para la animación.
  • La vista inferior izquierda muestra cómo los píxeles semitransparentes del gráfico se transponen al color rojo mate seleccionado. También observe cómo esos píxeles, que son completamente transparentes, permanecen completamente transparentes. Mientras que solo los píxeles que tienen un poco de transparencia se "subyacen" con el color mate, y los píxeles completamente opacos no se ven afectados por la configuración de transparencia (sin embargo, se ven afectados por las selecciones en el tipo de difuminado y colores).
  • La parte inferior derecha se parece al tipo de opciones de exportación que se usaron para su imagen de ejemplo. Con un mate blanco seleccionado, los mismos píxeles que muestran rojo en la imagen inferior izquierda, mostrarán blanco en la imagen inferior derecha. Esto es perfectamente aceptable si lo muestra contra un fondo blanco. Con otros fondos más oscuros, los píxeles blancos se muestran porque se usa el color mate incorrecto para crear píxeles completamente opacos para cualquier píxel que no sea completamente transparente.

Vea los dos gifs exportados con mate rojo y blanco en esta imagen, contra un fondo diferente. Esto muestra cómo el mate rojo se combina muy bien con un fondo rojo, pero también lo perturbador que se ve el mate blanco sobre un fondo negro.

ingrese la descripción de la imagen aquí


Si se encuentra en la desafortunada situación de que no tiene el archivo original con alfas suavizadas completas (es decir, solo tiene el gif de 8 bits), es problemático revertir este rasterizado mate: debe eliminar píxel por píxel. el color mate de los píxeles semitransparentes y luego volver a exportarlos con configuraciones más apropiadas.

En el cuadro de diálogo Guardar para Web, asegúrese de configurar el color Mate a la derecha de la ventana con el color de fondo de su página web.

Los GIF no admiten una transparencia total de 8 bits, solo admiten una transparencia de 1 bit. Lo mejor que puede hacer es usar un color que coincida con el fondo de la página web para que la imagen se mezcle fácilmente con ese color.