Workflow· 6 minutong basahin

Pag-edit ng SVG online: Mag-recolor at mag-alis ng background nang walang software

Ayaw mong mag-install ng Illustrator para mag-edit ng SVG? Ipinapakiita ng artikulo ang pag-recolor, one-click na pag-alis ng background, pagbura ng path, pagpinta gamit ang brush, pagbura gamit ang eraser at ang export sa online SVG editor — libre at walang instalasyon.

1. Ano ang kaya ng online SVG editor

Ang unang reaksyon ng marami sa pag-edit ng SVG ay ang pag-install ng Illustrator, ngunit para sa mga mababang gawain tulad ng pag-recolor, pag-alis ng background o pagbura ng elemento, sapat na ang online editor. Ang PolySVG online SVG editor ay tumatakbo sa browser, libre, walang instalasyon o rehistrasyon, at sumusuporta sa mga operasyon sa antas ng path: pagpili para magbura, one-click na pag-alis ng background, pagpinta gamit ang brush, pagbura gamit ang mask, pag-recolor, undo at redo, at sa dulo ay pag-export ng SVG o PNG. Maaari kang mag-upload ng SVG nang direkta, o magdala ng conversion result sa isang click mula sa larawan sa SVG tool. Para sa mga taga-pagtoko ito ay magandang paraan para sa final cleanup bago ihatid; para sa mga developer ito ay mabilis na paraan para ayusin ang kulay at laki ng icon bago ilagay sa pahina nang hindi umuulit sa design tool.

2. Pag-recolor: bigyan ang icon ng bagong tema

Pumili ng color block sa canvas para piliin ang katugmang path, pagkatapos ay palitan ang fill sa color panel. Karaniwang senaryo: paglipat ng isang icon set sa pagitan ng light at dark theme, pag-calibrate ng vectorized na logo sa brand color nito, o pagkakapareho ng paleta ng mga asset mula sa iba't ibang pinagmulan. Kung ihahCompare sa paghahanap ng fill attribute sa code, mas intuitive ang pag-click para mag-recolor at hindi gaanong napipinsala ang ibang path.

3. Pag-alis ng background: automatic at manuwal na paglinis

Pindutin ang "one-click background removal" at natutukoy ng engine ang pangunahing kulay sa gilid at natatanggal ang background layer, na transparent ang white-background na SVG sa loob ng ilang segundo. Ang anumang natitirang background path ay pwedeng piliin gamit ang mouse at burahin. Kung bitmap pa rin ang hawak mo, gamitin ang larawan sa transparent na vector tool para mag-convert at mag-alis ng background sa isang hakbang, pagkatapos ay tapusin ang paglinis sa editor.

4. Brush at eraser: pagpinta at pagbura

Ang brush ay additive: nagpapakita ito ng mga kulang na stroke, at awtomatikong na-vectorize ang mga stroke bilang bagong path na nahahawakan sa orihinal na sining — perpekto para sa pag-aayos ng putol na stroke sa vectorized na logo. Ang eraser ay subtractive: itinatago nito ang isang bahagi gamit ang mask nang hindi sirasera ang orihinal na path data, at maaari mong i-undo kapag sobra ang binura. Nagtutulungan ang dalawa sa undo/redo, kaya malaya kang mag-eksperimento. Idinadagdag ang mga brush stroke sa file bilang hiwalay na path at maaari pa ring i-recolor sa bandang huli sa pamamagitan ng pag-click; ang epekto ng mask ng eraser ay nalalapat sa panahon ng export, kaya ang na-export na SVG ay tumutugma sa nakikita mo sa canvas.

5. Undo, redo at export

Ang editor ay nag-iimbak ng kumpletong kasaysayan ng iyong mga aksyon, i-undo ang mali at i-redo kung magbabago ang isip. Kapag tapos na, mag-export ng SVG para sa web o para sa karagdagang pag-edit, o mag-export ng PNG para ilagay sa dokumento o gamitin bilang preview image. Para sa mga paraan ng pagbukas at pagtingin ng SVG file, tingnan ang Paano buksan ang SVG file; ang direktang link ng editor ay /editor. Kapag nag-e-export ng PNG, pumili ng sapat na malaking resolution para hindi malabo sa dokumento; para sa web, mag-export ng SVG para mapanatili ang katangian nitong vector.

6. Mabilis na reference para sa karaniwang edit na gawain

  • Palitan ang tema ng icon: pumili ng path at palitan ang fill, pagkatapos ay mag-export ng isang bersyon para sa light at isang bersyon para sa dark theme;
  • Gawing transparent ang white-background asset: one-click na pag-alis ng background, burahin ang natitirong path, mag-export ng transparent na SVG;
  • Ayusin ang putol na stroke ng logo: ipaint sa bakod ng gap gamit ang brush para awtomatikong ma-vectorize ang stroke, pagkatapos ay i-recolor nang pantay-pantay;
  • Burahin ang hindi kailangang elemento: pumili ng bawat color block na hindi kailangan at burahin, at gamitin ang eraser para sa detalye sa gilid;
  • Larawan para sa dokumento: kapag tapos na ang pag-edit, mag-export ng PNG at ilagay ito sa Word, PowerPoint o chat window.

Mga madalas itanong

Kailangan ba ng account para mag-edit ng SVG online?

Hindi. Ang PolySVG online editor ay libre, hindi nangangailangan ng rehistrasyon at handa na sa oras na buksan mo ito sa browser.

Sinasira ba ng eraser ang orihinal na path?

Hindi. Gumagana ang eraser gamit ang mask, kaya napapanatili ang orihinal na path data at maaari mong i-undo anumang oras.

Subukan na agad

Tapos na ang tutorial? Magpraktis gamit ang mga libreng tool ng PolySVG:

Magpatuloy