Como editar un archivo SVG online (paso a paso)
Tutorial practico
Editar un SVG no requiere programas pesados. Con un editor online como svgdesk puedes hacerlo desde el navegador, gratis y sin instalar nada. Los archivos se procesan en tu equipo, no se suben a ningun servidor.
1. Abre el archivo SVG
Tienes dos formas: arrastrar el archivo .svg directamente al area de trabajo, o pulsar Subir SVG en la barra superior. Tambien puedes empezar de cero con Nuevo y elegir el tamaño del lienzo.
2. Selecciona una forma
Con la herramienta de seleccion (flecha) haz clic en cualquier elemento. Apareceran tiradores para mover, escalar por los lados o esquinas, y un punto para rotar. Arrastra para mover; usa las esquinas para cambiar tamaño.
Para seleccionar varias formas a la vez, manten Shift y haz clic en cada una, o arrastra un recuadro de seleccion sobre un area vacia: todo lo que quede contenido dentro queda seleccionado. Con varias seleccionadas puedes moverlas o cambiarles el color juntas.
3. Cambia colores y estilo
En el panel derecho ajusta el relleno, el borde, el grosor, la opacidad y la rotacion. Puedes escribir un color en hexadecimal o usar el selector. Para quitar relleno o borde, usa el boton de "sin color".
4. Edita los nodos (opcional)
Para cambiar la forma en si, entra al modo nodo: haz doble clic en una forma. Podras mover anclas, convertir esquinas en curvas, ajustar las asas bezier y agregar o eliminar nodos. Util para afinar trazos con precision.
5. Agrupa o separa elementos
Con varias formas seleccionadas pulsa Agrupar (o Ctrl+G) para tratarlas como una sola. Desagrupar (Ctrl+Shift+G) deshace el grupo. Si un icono es un unico trazado compuesto de varias partes (por ejemplo una manzana y su hoja en un solo path), Desagrupar lo separa en trazados independientes para que puedas darle color distinto a cada parte.
6. Edita el codigo directamente
El panel de codigo SVG es editable y se sincroniza en vivo. Si sabes algo de SVG, puedes pegar o modificar el codigo y ver el resultado al instante. El boton Optimizar limpia el codigo (hexadecimal, redondeo, sin metadatos) sin romper la imagen.
7. Exporta tu trabajo
Pulsa Exportar. En el dialogo defines el nombre del archivo (por defecto el del icono del catalogo o del archivo que subiste, o "untitle" si empezaste de cero) y eliges SVG (vectorial) o PNG (imagen en alta resolucion, 2x). Si intentas salir con cambios sin guardar, el editor te avisa y te ofrece descargar antes.
Atajos utiles
- V seleccionar, R rectangulo, E elipse, L linea, P pluma, D lapiz, N nodos.
- Ctrl+Z deshacer, Ctrl+Shift+Z rehacer.
- Ctrl+G agrupar, Ctrl+Shift+G desagrupar/separar, Ctrl+D duplicar.
- Supr eliminar lo seleccionado, Esc cancelar o salir del modo nodo.
- Shift al mover un nodo bloquea el eje; al dibujar fuerza cuadrado/circulo/linea recta. Shift+clic o recuadro: seleccion multiple.
Tambien puedes cambiar el aspecto del editor: el boton Tema (header) alterna la interfaz entre modo oscuro y claro, y Fondo alterna el damero del lienzo.