Generación de recursos de imagen a partir de capas

Última actualización el 2 nov 2026

Utilice el Generador para crear automáticamente archivos añadiendo extensiones de formato como .png o .jpg a los nombres de capa.

Añadir extensiones de archivo a los nombres de capa activa el Generador de Photoshop para crear archivos de imagen automáticamente cada vez que se guarda.Esto elimina los pasos de exportación repetitivos para proyectos web, de aplicación y multidispositivo que requieren varios formatos o tamaños.

Este flujo de trabajo funciona mejor cuando necesitas exportaciones coherentes y repetibles en varios formatos o resoluciones, como la creación de versiones @1x, @2x y @3x para diseños adaptables.Para las exportaciones puntuales o cuando necesites controles específicos de formato, utiliza Archivo > Exportar > Exportar como en su lugar.

El generador crea una carpeta específica para tus recursos y actualiza los archivos automáticamente mientras trabajas.Puedes generar varios formatos a partir de una sola capa, especificar la configuración de calidad, escalar los recursos a diferentes tamaños y organizar los resultados en subcarpetas, todo mediante las convenciones de nomenclatura de las capas.

  • Documento de Photoshop con capas o grupos de capas con nombre
  • Documento guardado en una ubicación conocida (o los recursos aparecerán en el escritorio)
  • Conocimiento de los formatos de salida necesarios para tu proyecto

Habilitar la generación de recursos de imagen

Selecciona Archivo > Automatizar > Complementos del generador > Recursos de imagen.

En el panel Capas, ubica la capa o grupo que deseas exportar.

Cambia el nombre de la capa añadiendo una extensión de archivo: .jpg, .png, .gif o .svg.Por ejemplo, cambia el nombre de “logo” a “logo.png”.

Guarda el documento con Ctrl + S (Windows) o Command + S (macOS).

Photoshop crea el archivo de imagen en una subcarpeta junto al documento guardado.Si el documento aún no se ha guardado, los recursos aparecen en una nueva carpeta en el escritorio.El generador permanece activo: cualquier cambio en las capas habilitadas para el generador desencadena actualizaciones automáticas en los recursos correspondientes.

Nota

Los nombres de las capas no pueden contener : (dos puntos) ni * (asterisco), ya que estos caracteres impiden la generación de recursos.

Generar varios formatos a partir de una capa

Una sola capa puede producir recursos en diferentes formatos, tamaños y niveles de calidad simultáneamente.Separe cada especificación de recurso en el nombre de la capa con una coma o un signo más.

Seleccione la capa en el panel Capas.

Cambia el nombre de la Capa con un formato separado por comas, por ejemplo: button.png, button.jpg90, 200% button@2x.png.

Guarde el documento.

Photoshop genera tres archivos independientes a partir del mismo contenido de la capa, lo que elimina la necesidad de exportar manualmente el mismo gráfico en diferentes formatos.

Control de calidad y escalado de recursos para diferentes pantallas

Seleccione la capa en el panel Capas.

Añade parámetros de calidad o tamaño al nombre del archivo. Por ejemplo: “button.jpg90” establece la calidad JPEG en un 90 %, o “200% logo@2x.png” duplica el tamaño del recurso.

Para varias resoluciones, separa cada especificación con comas: “icon.png, 200% icon@2x.png, 300% icon@3x.png”.

Guarde el documento para generar todas las variaciones.

Los sufijos de calidad controlan la compresión de los archivos JPG (1-100) y la profundidad de bits de los archivos PNG (8, 24 o 32). Los prefijos de tamaño aceptan porcentajes para el escalado relativo o dimensiones en píxeles absolutas. Puedes combinar unidades (por ejemplo, “10in x 5cm banner.jpg”) y omitir una dimensión para escalar proporcionalmente: “1080 x icon.png” establece la anchura en 1080 píxeles mientras mantiene la relación de aspecto.

Sugerencia

Usa las convenciones de nomenclatura @2x y @3x para generar automáticamente versiones retina y de alta resolución (high-DPI) para proyectos web adaptables y aplicaciones móviles.

Ejemplos de escalado relativo:

200% logo.png duplica el tamaño del recurso

50% thumbnail.jpg reduce el recurso a la mitad de su tamaño

Ejemplos de tamaño absoluto:

300 x 200 hero.png crea una imagen de 300×200 píxeles

10in x 5cm banner.jpg combina unidades (10 pulgadas de ancho, 5 centímetros de alto)

1080 x icon.png establece la anchura en 1080 píxeles, la altura se escala proporcionalmente

Sugerencia

Al especificar dimensiones en píxeles, escribe los números directamente sin indicar unidades. Usa “300 x 200” en lugar de “300px x 200px”.

Organizar recursos en subcarpetas

De forma predeterminada, todos los recursos generados se guardan en una sola carpeta junto al archivo PSD. Si añades el nombre de una subcarpeta antes del nombre del archivo, el generador la creará y la usará automáticamente. Esto mantiene los recursos relacionados organizados sin necesidad de administrar carpetas manualmente.

Incluye la ruta de la subcarpeta en el nombre de la capa con barras diagonales: subfolder/filename.png o icons/logo.svg.Puedes anidar varios niveles: assets/icons/logo.png.

Exportar recursos a carpetas específicas

Cambia el nombre de la capa utilizando rutas de subcarpetas en el nombre del archivo.Por ejemplo: mobile/button.png, desktop/button.png.

Guarde el documento.

Photoshop crea la estructura de carpetas automáticamente y coloca cada recurso en su ubicación designada.Combinar subcarpetas con prefijos de tamaño y configuración de calidad proporciona un control total sobre la organización de los recursos: mobile/200% button@2x.png, desktop/button.jpg90.

Establecer valores predeterminados a nivel de documento

Crea una capa especial para establecer la configuración de línea de base que se aplica a todos los recursos generados.Esto elimina las especificaciones de parámetros repetitivas en los nombres de las capas individuales.

Crea una capa vacía y asígnale un nombre que empiece con “default”, seguido de tu configuración preferida.Las configuraciones habituales incluyen “default 200%” para escalar todos los recursos al 200 %, “default assets/” para guardar todo en una subcarpeta de recursos, o “default @2x” para añadir el sufijo @2x a todos los nombres de archivo.

Puedes combinar varios valores predeterminados: “default 200% retina/ @2x” escala todos los recursos al 200 %, los guarda en una subcarpeta retina y añade el sufijo @2x a los nombres de archivo.La configuración de cada capa anula los valores predeterminados del documento: si el valor predeterminado especifica “default 200%” pero el nombre de una capa incluye “50% thumbnail.png”, esa capa se genera al 50 %.

Trabajar con documentos en la nube

Los documentos en la nube almacenan los recursos generados localmente en lugar de hacerlo directamente junto al archivo PSD.Photoshop mantiene esta separación para distinguir entre el contenido local y el sincronizado con la nube.

Los recursos de los documentos en la nube aparecen en estas ubicaciones:

  • Windows: C:\Usersusername>\Documents\Adobe\Photoshop Cloud Associates
  • macOS: /Users//Documents/Adobe/Photoshop Cloud Associates

Cada documento en la nube crea su propia subcarpeta dentro de este directorio.Los recursos se generan automáticamente mientras trabajas, pero permanecen en tu máquina local hasta que los compartas o sincronices explícitamente en Creative Cloud.

Desactivar la generación de recursos

La generación de recursos de imagen permanece activa para un documento una vez habilitada, y persiste entre sesiones.Esta función regenera automáticamente los recursos cada vez que guardas, lo que puede ralentizar el rendimiento en documentos complejos.

Para desactivar la generación en el documento actual, anula la selección de Archivo > Automatizar > Complementos del generador > Recursos de imagen.Esto detiene la creación automática de recursos, pero conserva los recursos existentes y los nombres de las capas.

Para desactivar el generador de forma global en todos los documentos, seleccione Edición > Preferencias > Complementos, anule la selección de Habilitar generador y seleccione Aceptar.Esto desactiva completamente la funcionalidad del generador hasta que vuelva a habilitarla en Preferencias.