[{"data":1,"prerenderedAt":154},["ShallowReactive",2],{"blog-post-/blog/es-es/how-to-view-recolor-and-optimize-svg-online":3,"related-posts-/blog/es-es/how-to-view-recolor-and-optimize-svg-online":142},{"id":4,"title":5,"author":6,"body":7,"category":123,"date":124,"description":125,"extension":126,"featured":127,"image":128,"meta":129,"navigation":130,"path":131,"readingTime":132,"seo":133,"stem":134,"tags":135,"tools":140,"__hash__":141},"content/blog/es-ES/how-to-view-recolor-and-optimize-svg-online.md","Cómo ver, cambiar colores y optimizar código SVG online","Anything Tools Editorial",{"type":8,"value":9,"toc":116},"minimark",[10,14,23,28,53,57,64,89,93],[11,12,5],"h1",{"id":13},"cómo-ver-cambiar-colores-y-optimizar-código-svg-online",[15,16,17,18,22],"p",{},"Cuando generas iconos ",[19,20,21],"code",{},"\u003Csvg>"," con asistentes como Claude o ChatGPT o descargas recursos desde SVGRepo y Figma, revisar el XML en bruto no basta para comprobar proporciones ni contrastes. Un flujo de trabajo en el navegador te permite previsualizar, recolorear, comprimir y exportar el gráfico en segundos.",[24,25,27],"h2",{"id":26},"vista-previa-en-cuadrícula-transparente-fondo-claro-y-oscuro","Vista previa en cuadrícula transparente, fondo claro y oscuro",[15,29,30,31,34,35,40,41,44,45,48,49,52],{},"Pega tu código o arrastra un archivo ",[19,32,33],{},".svg"," al ",[36,37,39],"a",{"href":38},"/dev/svg-viewer","Visor y Optimizador SVG",". El lienzo detecta automáticamente las dimensiones del ",[19,42,43],{},"viewBox"," incluso si el archivo no tiene atributos ",[19,46,47],{},"width"," y ",[19,50,51],{},"height",", permitiéndote alternar entre fondos claros, oscuros y transparentes.",[24,54,56],{"id":55},"cambia-colores-en-tiempo-real-sin-buscar-en-el-código","Cambia colores en tiempo real sin buscar en el código",[15,58,59,60,63],{},"En lugar de reemplazar valores hexadecimales manualmente en decenas de etiquetas ",[19,61,62],{},"\u003Cpath>",":",[65,66,67,79,82],"ol",{},[68,69,70,71,75,76,78],"li",{},"Revisa la barra de ",[72,73,74],"strong",{},"Colores detectados"," debajo del lienzo en el ",[36,77,39],{"href":38},".",[68,80,81],{},"Haz clic en cualquier muestra y mueve el cursor del selector para ver cómo cambia el gráfico en vivo.",[68,83,84,85,78],{},"Si necesitas ajustar primero tu paleta, apóyate en el ",[36,86,88],{"href":87},"/design/color-picker","Selector de Color",[24,90,92],{"id":91},"minifica-el-xml-o-exporta-en-png-2x-4x","Minifica el XML o exporta en PNG 2x / 4x",[15,94,95,96,99,100,103,104,107,108,111,112,78],{},"Pulsa ",[72,97,98],{},"Optimizar"," para eliminar comentarios, metadatos y espacios innecesarios, o copia el vector como ",[19,101,102],{},"Data URI"," para CSS. Si necesitas una imagen rasterizada nítida, elige escala ",[19,105,106],{},"2x"," o ",[19,109,110],{},"4x"," y descárgala en PNG o WebP, o convierte lotes completos con el ",[36,113,115],{"href":114},"/image/converter","Convertidor de Imágenes",{"title":117,"searchDepth":118,"depth":118,"links":119},"",2,[120,121,122],{"id":26,"depth":118,"text":27},{"id":55,"depth":118,"text":56},{"id":91,"depth":118,"text":92},"Developer Tools","2026-10-27T00:00:00.000Z","Previsualiza código SVG en el navegador, cambia colores en tiempo real arrastrando el selector, minifica el XML y exporta imágenes PNG o WebP en 2x y 4x.","md",false,"/blog/how-to-view-recolor-and-optimize-svg-online.png",{},true,"/blog/es-es/how-to-view-recolor-and-optimize-svg-online",5,{"title":5,"description":125},"blog/es-ES/how-to-view-recolor-and-optimize-svg-online",[136,137,138,139],"SVG viewer","SVG optimizer","SVG to PNG","developer tools",[38,114,87],"R7587chW5L8BIirfgSGqU5qQk9kaj1ksmOuB9IAkTBQ",[143,149],{"path":144,"title":145,"description":146,"date":147,"image":148,"category":123,"readingTime":132},"/blog/es-es/convert-image-to-base64-guide","Convertir imágenes a Base64: cuándo ayuda y cuándo perjudica","Aprende cuándo las cadenas de imagen Base64 son útiles para prototipos, correos y activos pequeños, y cuándo es mejor usar archivos normales.","2026-08-14T00:00:00.000Z","/blog/convert-image-to-base64-guide.png",{"path":150,"title":151,"description":152,"date":124,"image":153,"category":123,"readingTime":132},"/blog/es-es/how-to-convert-chatgpt-session-json-safely","Cómo convertir archivos JSON de sesión de ChatGPT de forma segura en el navegador","Convierte JSON de sesión de ChatGPT a formatos Sub2API, CPA, Cockpit, 9Router, Codex y AxonHub localmente en el navegador sin exponer tus tokens.","/blog/how-to-convert-chatgpt-session-json-safely.png",1793175879693]