# PNG con fondo transparente: cuándo lo necesitas y cómo hacerlo [Canonical HTML page](https://gradiently.design/es/guide/transparent-background) Un PNG transparente es el archivo al que recurres cuando un logo o un título tiene que ir sobre algo que no diseñaste. También es el archivo que la gente usa cuando no debería. ## The short version - Un PNG con fondo transparente guarda un canal alfa, de modo que cada píxel puede ser totalmente transparente, totalmente opaco o cualquier punto intermedio. - Los PNG transparentes son adecuados para logos, títulos, pegatinas y superposiciones que irán sobre fondos que no controlas, como vídeos, diapositivas y webs. - El JPG no puede guardar transparencia, así que el JPG de un logo siempre lleva una caja de color sólido detrás. - La mayoría de las publicaciones para redes deben exportarse con su fondo completo, no como archivos transparentes. - Revisa una exportación transparente sobre un fondo claro y otro oscuro, porque los bordes pálidos y las sombras tenues solo se ven en uno de los dos. Un **PNG con fondo transparente** es una imagen en la que el fondo se ha dejado vacío, de modo que solo queda el logo, el texto o el objeto, y se ve lo que haya debajo. Lo necesitas siempre que tu diseño vaya a colocarse sobre algo que no hiciste tú: un logo en la web de un cliente, un título sobre imágenes de vídeo, una pegatina sobre una foto, un logotipo en una diapositiva. El PNG puede hacerlo porque guarda un canal alfa, un cuarto valor para cada píxel que indica cuánto se transparenta. El JPG no tiene canal alfa, por eso un logo en JPG siempre llega dentro de una caja blanca o de color. ## Cómo funciona la transparencia en un PNG Cada píxel de una imagen normal tiene tres valores: rojo, verde y azul. Un PNG con transparencia añade un cuarto, el alfa, que va de totalmente transparente a totalmente opaco. Los valores intermedios importan tanto como los extremos. El borde suave de una letra, una sombra delicada o un efecto de cristal están hechos de píxeles parcialmente transparentes, y son los que permiten que el diseño se funda con lo que tenga detrás. | Formato | Transparencia | Ideal para | | --- | --- | --- | | PNG | Alfa completo, bordes suaves | Logos, títulos, pegatinas, superposiciones | | JPG | Ninguna | Fotos y diseños completos con fondo | | SVG | Sí, vectorial | Logos e iconos en webs, escalables a cualquier tamaño | | WebP | Alfa completo | Imágenes web donde importa el peso del archivo | | GIF | Solo sí o no, bordes duros | Animaciones sencillas | | MP4 | Ninguna en el uso habitual | Vídeo con su propio fondo | Qué formatos pueden llevar un fondo vacío. La transparencia del GIF es todo o nada, así que los bordes suaves se ven dentados; PNG y WebP los mantienen limpios. Para una comparación más a fondo de los dos formatos más habituales, consulta [PNG o JPG](https://gradiently.design/es/guide/png-vs-jpeg), y para logos en webs, [SVG o PNG](https://gradiently.design/es/guide/svg-vs-png) explica cuándo conviene más el vector. ## Cuándo necesitas un PNG transparente - **Logos para que otros los usen.** Socios, prensa, organizadores de eventos y patrocinadores colocan tu logo sobre sus propios fondos. Envía un PNG transparente, a ser posible en las [variantes de logo](https://gradiently.design/es/guide/logo-variations) clara y oscura, y además un SVG. - **Títulos y rótulos en vídeo.** Los editores de vídeo superponen un PNG transparente a las imágenes, para que las palabras floten sobre el plano. - **Pegatinas y superposiciones.** Distintivos como «Nuevo» o «Vendido», marcos y etiquetas de precio sobre fotos o historias. - **Diapositivas y documentos.** Un logo o un diagrama que tiene que ir sobre una diapositiva de color sin caja blanca. - **Webs.** Iconos, logos e ilustraciones sobre secciones de color o fondos de cabecera. - **Merchandising e impresión bajo demanda.** Muchos servicios de impresión piden un PNG transparente para que solo se imprima el dibujo en la camiseta o la taza. Un banner panorámico con el logotipo Northfield sobre un fondo degradado El diseño completo: logotipo y fondo juntos, adecuado para un banner o una publicación. El mismo logotipo Northfield sobre un fondo de otro color, como permitiría un PNG transparente Exportado con transparencia, el mismo logotipo puede ir sobre el fondo de un socio. Aquí cae sobre otro campo de color. ## Cuándo un fondo transparente es mala idea La transparencia es para piezas, no para trabajos terminados. Una publicación en redes, una historia, un póster o una cabecera de correo deben exportarse con su fondo, porque ese fondo es la mitad del diseño. La mayoría de las redes sociales no conservan la transparencia en lo que subes, y una zona vacía puede rellenarse con un color que no elegiste. Algunos marketplaces también piden fotos de producto sobre blanco sólido en lugar de transparente, así que revisa las normas de cada plataforma. ### Exportar transparente - Un logo para socios y prensa - Un título para superponer al vídeo - Una pegatina o distintivo para fotos - Un icono para una sección web de color - Un dibujo para impresión bajo demanda ### Exportar con fondo - Publicaciones de Instagram, LinkedIn y Facebook - Historias, portadas de Reels y miniaturas - Pósteres, folletos y cartas - Cabeceras de correo - Todo lo que quieras que se vea tal como lo diseñaste ## Cómo hacer un PNG transparente Hay dos caminos. Si diseñas la pieza tú, como un título, un logo o un distintivo, créala sin fondo y exporta con la transparencia activada. Si partes de una foto, primero tienes que quitar el fondo, a mano o con una herramienta de eliminación, que es un trabajo distinto y más difícil. Los pasos siguientes cubren el primer camino. 1. **Diseña al tamaño que necesitarás** Los archivos transparentes suelen ampliarse después, así que exporta más grande de lo que crees: un logotipo de 2.000 px de ancho o más es un comienzo seguro. 2. **Deja el fondo vacío** Oculta o borra cualquier capa de fondo. La mayoría de las herramientas muestran el vacío como un tablero de cuadros grises y blancos. 3. **Elige PNG con transparencia** En el cuadro de exportación, elige PNG y asegúrate de que la transparencia o el fondo transparente está marcado. El JPG lo rellenará de blanco sin avisar. 4. **Recorta los bordes** Recorta hasta el dibujo con un poco de aire, para que quien lo coloque no tenga que pelearse con márgenes invisibles. 5. **Pruébalo sobre claro y oscuro** Coloca el archivo sobre una página blanca y otra negra. Busca halos pálidos, sombras que faltan y texto que desaparece en una de ellas. - Prueba sobre blanco: #ffffff - Prueba sobre gris medio: #808080 - Prueba sobre casi negro: #111111 - Prueba sobre color de marca: #2563eb Cuatro fondos para comprobar cada exportación transparente. Un borde pálido se ve sobre negro; una sombra oscura desaparece en él; un dibujo blanco desaparece sobre blanco. > **El problema del halo blanco** Si el dibujo se hizo en su día sobre blanco, sus bordes suaves pueden conservar un fino reborde pálido que se ve sobre fondos oscuros. Exporta desde las capas originales sin fondo, en lugar de borrar el blanco de una imagen acoplada. ## Exportar PNG transparente en Gradiently En Gradiently, un diseño normalmente va sobre su Mark, el fondo vivo que está detrás de todo. Con Pro, puedes exportar en su lugar un PNG transparente: solo tus elementos, como texto, formas, iconos y fotos, sobre un fondo transparente, sin el Mark. Es el archivo que envías a un socio, metes en un editor de vídeo o colocas en una web. Pro también exporta SVG para los mismos usos, y ambos salen del mismo diseño que publicas con su fondo completo. Como en cualquier exportación de Gradiently, el Mark del diseño tiene que ser tuyo. [Exportar imágenes y bucles](https://gradiently.design/es/guide/export-images-and-loops) repasa cada formato, y para logos sobre color, consulta [logo sobre fondo degradado](https://gradiently.design/es/guide/logo-on-gradient-background). ## FAQ ### ¿Un JPG puede tener fondo transparente? No. El JPG no tiene canal alfa, así que cualquier zona vacía se rellena con un color sólido, normalmente blanco. Usa PNG, WebP o SVG. ### ¿Por qué mi PNG transparente tiene fondo blanco? O no se activó la transparencia al exportar, o la app con la que lo abriste muestra las zonas vacías en blanco. Colócalo sobre un fondo oscuro para comprobarlo. ### ¿Debo subir PNG transparentes a Instagram? No. Exporta publicaciones e historias con su fondo completo, porque la plataforma no conserva la transparencia y puede rellenar las zonas vacías con su propio color. ### ¿Qué es mejor para un logo, PNG transparente o SVG? SVG para webs y todo lo que se escala, porque se mantiene nítido a cualquier tamaño. PNG transparente para apps, editores de vídeo y personas que no pueden abrir SVG. ### ¿Qué tamaño debe tener un logo en PNG transparente? Más grande de lo que crees que vas a necesitar, al menos 2.000 píxeles de ancho para un logotipo, para que otros puedan reducirlo sin que pierda nitidez.