Cómo Hacer que un Fondo sea Transparente en Figma (Guía 2026)

Figma está diseñado para el diseño de interfaces, no para la edición de fotos, así que "eliminar el fondo" significa algo distinto ahí que en una herramienta de fotografía. Si solo necesitas que el fondo de tu frame o mesa de trabajo desaparezca al exportar, Figma puede hacerlo de forma nativa. Pero si tienes una foto con un fondo recargado (una foto de producto, un retrato, una imagen colocada), Figma no tiene forma integrada de detectar el sujeto y recortarlo; necesitas un plugin, mucha paciencia con la herramienta Pluma, o un eliminador de fondos dedicado antes de que la imagen llegue a tu archivo.

Por qué importan los fondos transparentes en proyectos de Figma

Los PNG transparentes te permiten superponer un logo, una foto de producto o un icono sobre cualquier color, maqueta de captura de pantalla o degradado sin un recuadro visible alrededor. Eso importa para kits de UI, presentaciones de marketing, capturas de tienda de aplicaciones y cualquier sistema de diseño donde el mismo recurso deba colocarse sobre múltiples fondos.

Método 1: Exportar un frame con fondo transparente

Paso 1: Selecciona tu frame, grupo o componente en Figma.

Paso 2: En el panel de la derecha, elimina u oculta el relleno de fondo del frame (haz clic en la muestra de color y bórrala, o desactiva su visibilidad).

Paso 3: Abre la sección de Exportar en la parte inferior del panel derecho, elige PNG y exporta. PNG admite transparencia alfa, así que donde se eliminó el relleno de fondo se exportará como transparente en lugar de blanco.

Esto funciona bien para logos, iconos y maquetas de UI donde el "fondo" es solo un color de relleno que añadiste en Figma, no una escena fotografiada.

Método 2: Eliminar el fondo de una foto colocada

Si la necesidad de fondo transparente es una foto (una foto de producto, un retrato, la captura de un objeto físico), la configuración de exportación de Figma no puede ayudar, porque el fondo no es un relleno de Figma, es parte de los píxeles de la propia imagen. Dentro de Figma, tus opciones reales son un plugin de la comunidad que llama a una API externa, o enmascarar manualmente el sujeto con la herramienta Pluma, lo cual es lento y rara vez produce bordes limpios alrededor del cabello, el pelaje o los detalles finos.

El camino más rápido: elimínalo antes de importarlo

El flujo de trabajo más simple para la mayoría de los diseñadores es eliminar primero el fondo de la foto y luego arrastrar el PNG transparente resultante directamente a Figma. Sube la imagen a nobackground, deja que la IA en el dispositivo recorte el sujeto en unos segundos, descarga el PNG y colócalo en tu lienzo: sin permisos de plugin, sin cuenta, y sin que ninguna imagen salga de tu navegador en el proceso.

Consejos para exportaciones transparentes limpias

• Exporta a escala 2x o 3x para cualquier cosa que se use en una pantalla de alta densidad, y reduce la escala después si es necesario; esto evita bordes suaves y borrosos alrededor del recorte.
• Previsualiza los PNG transparentes sobre un patrón de ajedrez o un fondo oscuro antes de entregarlos, ya que un halo gris claro en el borde es fácil de pasar por alto sobre un lienzo blanco liso.
• Si vas a colocar el mismo recorte en varias maquetas, guarda el PNG transparente original como un recurso compartido en tu biblioteca de Figma en lugar de volver a exportarlo desde cada frame.

Preguntas sobre transparencia en Figma

¿Figma tiene un eliminador de fondos integrado? No. Figma puede exportar frames o formas con un relleno transparente, pero no puede detectar y recortar automáticamente un sujeto de una foto sin un plugin o una herramienta externa.

¿Un PNG transparente de nobackground funcionará directamente en Figma? Sí. Solo arrastra y suelta el PNG descargado en tu lienzo como cualquier otro recurso de imagen; la transparencia se conserva.

Por qué tu exportación de Figma sigue teniendo fondo blanco

Este es el problema de transparencia más común en Figma, y casi siempre se reduce a una de cuatro causas. Primera, el frame todavía tiene un relleno: en algunos archivos antiguos, ocultar un relleno con el icono del ojo lo deja igualmente en la exportación, así que borra el relleno en vez de desactivarlo. Segunda, has exportado JPG en lugar de PNG; el JPG no tiene canal alfa y aplana la transparencia a blanco siempre, sin excepción. Tercera, hay otro frame o un rectángulo blanco detrás de tu contenido del que te has olvidado, algo fácil de pasar por alto dentro de un Auto Layout muy anidado. Cuarta, la propia imagen tiene el fondo blanco grabado en sus píxeles, y en ese caso nada del panel de exportación de Figma va a ayudar, porque Figma está exportando fielmente justo lo que hay.

Una forma rápida de diagnosticarlo es poner temporalmente el color del lienzo de la página en un magenta intenso. Todo lo que sea realmente transparente mostrará magenta; lo que sea blanco seguirá blanco y se delatará al instante.

Rellenos de imagen frente a imágenes colocadas

Figma trata una foto como el relleno de una forma y no como un objeto independiente, lo que sorprende a quien viene de Photoshop. Esa distinción importa aquí: como la foto es un relleno, no puedes borrar una parte de ella y la herramienta Pluma no la recorta. Lo que sí puedes hacer es dibujar una forma vectorial y usarla como máscara, que recorta el relleno a esa forma. Esto funciona bien para recortes geométricos, como una ficha de producto con esquinas redondeadas, y mal para siluetas orgánicas, como una persona, porque acabas dibujando a mano cada curva del contorno.

Si tu sujeto tiene pelo, pelaje, bordes difuminados o cualquier zona semitransparente, una máscara vectorial es estructuralmente la herramienta equivocada. Un trazado vectorial es un límite duro; el pelo necesita alfa parcial, es decir, píxeles con un 40% de opacidad. Por eso la respuesta práctica es traer una imagen que ya tenga canal alfa en lugar de intentar crear uno dentro de Figma.

Mantener los recortes nítidos en componentes y variantes

Una vez que un PNG transparente forma parte de un componente, unos pocos hábitos ahorran mucho retrabajo. Coloca la imagen dentro de su propio frame con el relleno en transparente, para que el componente se pueda redimensionar sin que el relleno de imagen se reencuadre de forma inesperada. Prefiere Fit antes que Fill en los recortes, porque Fill recorta al tamaño del frame y cortará tan tranquilo la parte superior de una cabeza cuando alguien redimensione una instancia. Si el mismo recorte aparece en varios tamaños dentro de un sistema de diseño, publícalo una vez como componente y usa instancias en lugar de pegar el PNG una y otra vez; así una sola reexportación actualiza todas las pantallas de golpe.

Ajustes de exportación que rompen la transparencia sin avisar

Más allá de la trampa del JPG, hay tres ajustes que causan problemas evitables. Exportar a 1x para una maqueta retina produce bordes blandos que parecen un mal recorte cuando en realidad solo son una exportación con poca escala, así que usa 2x o 3x para cualquier cosa que se vaya a ver en una pantalla de alta densidad. Aplicar un desenfoque de fondo o de capa a un frame obliga a Figma a rasterizar un área mayor y puede introducir un límite rectangular tenue en el PNG exportado. Y una sombra paralela aplicada al frame en vez de al objeto se renderiza como sombra del rectángulo y no de la silueta del recorte, algo que delata al instante que el recurso se montó en vez de fotografiarse.

PNG, SVG y WebP para la entrega

Para un recorte fotográfico, PNG es la exportación correcta en casi todos los casos: es el único formato ráster ampliamente compatible que conserva el alfa por píxel sin dudas de compatibilidad. SVG solo tiene sentido si el arte es realmente vectorial, como un logotipo dibujado con formas; exportar una foto como SVG simplemente incrusta los datos ráster dentro de una envoltura SVG y hace el archivo más grande sin ningún beneficio. WebP genera archivos bastante más pequeños con la transparencia intacta y es una buena opción para recursos web en producción, pero entrega PNG a tus compañeros y deja la conversión a WebP como paso del build, porque algunas herramientas de diseño e impresión todavía manejan WebP de forma irregular.

Peso de los archivos y bibliotecas compartidas

Los PNG transparentes pesan más que el JPG equivalente porque el canal alfa añade datos y la compresión PNG es sin pérdidas. En un archivo de Figma grande con decenas de recortes a resolución completa, esto se traduce en una carga lenta del archivo para todo el equipo. El arreglo práctico es guardar un maestro de alta resolución de cada recorte fuera del archivo de trabajo y colocar dentro de Figma una versión de tamaño razonable, más o menos el doble del tamaño máximo de visualización que necesites. Mantienes la calidad donde importa y dejas de pagarla cada vez que se abre el archivo.