recortar SVG
☞ funciona por completo en tu navegador — no se sube nadaSuelta tu SVG aquí
o haz clic para buscar — solo SVG
Vista previa
recortar SVG
Arrastra un marco sobre tu SVG para elegir la parte que quieres conservar. Solo cambia el viewBox — cada trazado se queda exactamente igual, así que siempre puedes volver a abrir el recorte.
o haz clic para buscar — solo SVG
Vista previa
una ventana, no un cuchillo
Un SVG guarda su dibujo en un sistema de coordenadas, y el viewBox es la ventana por la que lo miras. Mueve esa ventana y habrás recortado la imagen: no se edita ningún trazado, no se borra ningún punto, no se redibuja nada. Por eso el resultado es perfecto a cualquier tamaño y por eso más adelante puedes volver a ensanchar la ventana y recuperar el dibujo entero.
La contrapartida es que el archivo no se hace más pequeño: lo que queda fuera de la ventana sigue ahí, solo que no se muestra. Si quieres que desaparezca de verdad, recorta aquí primero y luego pasa el archivo por el optimizador de SVG.
tres pasos
Elige un archivo .svg — se queda en tu dispositivo.
Encuadra lo que quieras o escribe valores exactos del viewBox.
El mismo diseño, con una ventana nueva sobre él.
respuestas rápidas
No, y es lo esperable. Recortar mueve el viewBox, así que las formas de fuera siguen en el archivo — el navegador simplemente no las dibuja. Pasa el archivo recortado por el optimizador de SVG si quieres limpiar lo que sobra.
Sí. Como no se ha borrado nada, si vuelves a abrir aquí el archivo recortado y ensanchas el marco recuperas el dibujo completo. Esa es la diferencia práctica con recortar un JPG.
Son unidades de usuario del viewBox, el sistema de coordenadas propio del SVG. Un archivo puede medir 24 unidades de ancho y renderizarse a 512 píxeles. Los atributos width y height se escalan proporcionalmente por ti, así que el archivo recortado se muestra al tamaño que esperas.
Se le añade uno que coincide con el width y el height del archivo. Sin viewBox no hay ventana que mover, así que el recorte no tendría sobre qué actuar. Añadirlo no cambia nada visualmente.
Si tu SVG no tenía atributos width y height — lo habitual en iconos cuyo tamaño se define por CSS — así seguirá. Esos atributos solo se reescriben cuando ya estaban.
No. El archivo se analiza y se reescribe en tu navegador.