¿Guardar una forma vectorial con transparencia con un contorno limpio en Photoshop?

El problema que tengo es que después de dibujar una forma vectorial (círculo) de 16 px por 16 px, con un fondo transparente, todo sobre la forma es como lo necesito, excepto que el suavizado en la imagen hace que la imagen se ven irregulares cuando el fondo no es blanco.

Por lo que sé, cuando estoy guardando la imagen en Adobe Photoshop, es posible que esté guardando la imagen incorrectamente en la pantalla de diálogo "Guardar para Web". El resultado deseado es una forma vectorial de 16x16 (px) con un fondo transparente (para que pueda pasar el cursor sobre un degradado cuando la imagen se coloca en una página web). Esta imagen podría ser .gif o .png, me quedo con cualquiera.

Pasos para recrear:

  1. Abrir Photoshop
  2. Crear nuevo documento
  3. Agregar nueva capa
  4. Eliminar la capa de fondo
  5. Seleccione la herramienta Elipse (no la herramienta Marco elíptico)
  6. Haga clic con el botón izquierdo y arrastre en el lienzo
  7. Escriba 16px para la altura y el ancho en el cuadro de diálogo que aparece
  8. Haga clic en Aceptar y las propiedades de la forma vectorial que acabamos de agregar se verán así:Propiedades de forma
  9. Haga clic con el botón derecho en la forma en el lienzo y seleccioneMake Selection
  10. Deje Feather en "0" y marque Anti-Aliased, haga clic en Ok.
  11. En el Imagemenú, seleccioneCrop
  12. Abra el cuadro de diálogo Guardar para Web (ctrl + shft + alt + s)
  13. Los siguientes son 1 de los más de 20 patrones de configuración que probé:png Guardar para el patrón de configuración web
  14. Revisa la imagen guardada:imagen final, no parece un círculo suave en absoluto

Como podemos ver, esta imagen final no es un círculo suave, parece que no puedo suavizar el borde irregular de la imagen. Mis otros intentos son fluidos, pero desafortunadamente el suavizado no permanece transparente y se asemeja a un borde mate blanco, por lo que si el fondo sobre el que coloco esta imagen es blanco, todo se ve muy bien, pero el objetivo aquí es colocar esta imagen. sobre un fondo degradado oscuro.

La ayuda sería apreciada.

Respuestas (1)

Desea elegir PNG-24 en el segundo menú desplegable:

ingrese la descripción de la imagen aquí

Su punto debe parecerse al ejemplo de la derecha aquí:

ingrese la descripción de la imagen aquí

No soy una autoridad en el formato de archivo png (gráfico de red portátil), pero explicaré lo que sé al respecto.

Un png de 8 bits está limitado a 256 colores, mientras que el de 24 bits puede tener hasta 16 millones de colores.

Mi observación es que la transparencia es donde se ve la mayor degradación de la calidad, porque solo tiene dos niveles de opacidad en un png de 8 bits, pero tiene niveles casi ilimitados en un archivo de 24 bits.

Esta es la respuesta correcta, pero sería más útil para más personas en el futuro si incluye la explicación de por qué PNG-8 crea el problema y por qué PNG-24 lo maneja.
Lo haré en la próxima oportunidad que tenga.
¡Maaaan, Circle B está de nuevo con estas respuestas circulares!
¡Solo trato de correr en círculos a tu alrededor!
Una nota: puede tener múltiples niveles de transparencia en la imagen PNG. Pero Adobe Photoshop no puede hacer esto por usted.
¿Guardar una forma vectorial con transparencia con un contorno limpio en Photoshop?
RespuestasAquíPolítica de privacidad1y, 0v