[{"data":1,"prerenderedAt":158},["ShallowReactive",2],{"blog-post-/blog/ru-ru/how-to-view-recolor-and-optimize-svg-online":3,"related-posts-/blog/ru-ru/how-to-view-recolor-and-optimize-svg-online":146},{"id":4,"title":5,"author":6,"body":7,"category":127,"date":128,"description":129,"extension":130,"featured":131,"image":132,"meta":133,"navigation":134,"path":135,"readingTime":136,"seo":137,"stem":138,"tags":139,"tools":144,"__hash__":145},"content/blog/ru-RU/how-to-view-recolor-and-optimize-svg-online.md","Как просматривать, перекрашивать и оптимизировать код SVG онлайн","Anything Tools Editorial",{"type":8,"value":9,"toc":120},"minimark",[10,14,23,28,56,60,67,93,97],[11,12,5],"h1",{"id":13},"как-просматривать-перекрашивать-и-оптимизировать-код-svg-онлайн",[15,16,17,18,22],"p",{},"Когда вы генерируете ",[19,20,21],"code",{},"\u003Csvg>","-иконку через Claude или ChatGPT либо скачиваете вектор из SVGRepo и Figma, по сырому XML-коду трудно оценить итоговый вид и контрастность. Браузерный инструмент позволяет мгновенно проверить графику, поменять палитру, сжать код и экспортировать растровую копию.",[24,25,27],"h2",{"id":26},"предпросмотр-на-прозрачной-сетке-светлом-и-тёмном-фоне","Предпросмотр на прозрачной сетке, светлом и тёмном фоне",[15,29,30,31,34,35,40,41,44,45,47,48,51,52,55],{},"Вставьте код или перетащите файл ",[19,32,33],{},".svg"," в ",[36,37,39],"a",{"href":38},"/dev/svg-viewer","Просмотр и оптимизацию SVG",". Холст автоматически определяет размеры из атрибута ",[19,42,43],{},"viewBox",", даже если в теге ",[19,46,21],{}," не указаны ",[19,49,50],{},"width"," и ",[19,53,54],{},"height",", и позволяет переключаться между сеткой, светлым и тёмным фоном.",[24,57,59],{"id":58},"живая-замена-цветов-при-движении-курсора","Живая замена цветов при движении курсора",[15,61,62,63,66],{},"Вместо ручного поиска HEX-кодов по десяткам тегов ",[19,64,65],{},"\u003Cpath>",":",[68,69,70,83,86],"ol",{},[71,72,73,74,78,79,82],"li",{},"Обратите внимание на панель ",[75,76,77],"strong",{},"Найденные цвета"," под областью предпросмотра в ",[36,80,81],{"href":38},"Просмотре и оптимизации SVG",".",[71,84,85],{},"Нажмите на нужный образец цвета и перемещайте курсор в палитре — заливка и обводка будут меняться в реальном времени.",[71,87,88,89,82],{},"Подобрать гармоничный оттенок заранее поможет ",[36,90,92],{"href":91},"/design/color-picker","Палитра цветов",[24,94,96],{"id":95},"сжатие-xml-и-экспорт-в-png-2x-4x","Сжатие XML и экспорт в PNG 2x / 4x",[15,98,99,100,103,104,107,108,111,112,115,116,82],{},"Нажмите ",[75,101,102],{},"Сжать",", чтобы удалить комментарии, метаданные и лишние пробелы, или скопируйте готовый ",[19,105,106],{},"Data URI"," для вставки в CSS. Для презентаций и документов выберите масштаб ",[19,109,110],{},"2x"," или ",[19,113,114],{},"4x"," и скачайте чёткий PNG или WebP, а для пакетной конвертации используйте ",[36,117,119],{"href":118},"/image/converter","Конвертер изображений",{"title":121,"searchDepth":122,"depth":122,"links":123},"",2,[124,125,126],{"id":26,"depth":122,"text":27},{"id":58,"depth":122,"text":59},{"id":95,"depth":122,"text":96},"Developer Tools","2026-10-27T00:00:00.000Z","Живой предпросмотр SVG-кода в браузере, интерактивная смена цветов в реальном времени, сжатие XML и экспорт чётких PNG и WebP в масштабе 2x и 4x.","md",false,"/blog/how-to-view-recolor-and-optimize-svg-online.png",{},true,"/blog/ru-ru/how-to-view-recolor-and-optimize-svg-online",5,{"title":5,"description":129},"blog/ru-RU/how-to-view-recolor-and-optimize-svg-online",[140,141,142,143],"SVG viewer","SVG optimizer","SVG to PNG","developer tools",[38,118,91],"8gkf5d3bRUTh8ENghE9tKnfk-al_YhM8GrjnTxL76-A",[147,153],{"path":148,"title":149,"description":150,"date":151,"image":152,"category":127,"readingTime":136},"/blog/ru-ru/convert-image-to-base64-guide","Конвертация изображений в Base64: когда это полезно, а когда вредит","Узнайте, когда строки Base64 удобны для прототипов, писем и мелких иконок, а когда лучше использовать обычные файлы изображений.","2026-08-14T00:00:00.000Z","/blog/convert-image-to-base64-guide.png",{"path":154,"title":155,"description":156,"date":128,"image":157,"category":127,"readingTime":136},"/blog/ru-ru/how-to-convert-chatgpt-session-json-safely","Как безопасно конвертировать JSON сессии ChatGPT в браузере","Локальная конвертация JSON сессии ChatGPT в форматы Sub2API, CPA, Cockpit, 9Router, Codex и AxonHub прямо в браузере без передачи токенов на сервер.","/blog/how-to-convert-chatgpt-session-json-safely.png",1793175957124]