SVG stands for Scalable Vector Graphics. It is an open, text-based (XML) format that describes an image as shapes — lines, curves, paths, and text — using mathematical instructions instead of a fixed grid of pixels. Because it is math rather than pixels, an SVG can scale to any size without ever looking blurry, and it is small and editable as plain code.

How to create and edit SVG files online

Q: What's the difference between SVG and PNG?

PNG is a raster format: a fixed grid of pixels that blurs or pixelates when you scale it up. SVG is a vector format: shapes defined by math that stay perfectly sharp at any size. Use SVG for logos, icons, and illustrations that must look crisp everywhere; use PNG or JPG for photographs, which vectors cannot represent well.

Q: Do I need Illustrator to edit an SVG?

No. SVG is an open standard, so you do not need Adobe Illustrator or any paid design suite. A browser-based editor such as the Office Tools SVG Editor lets you draw shapes and paths, set fill and stroke colors, move and resize elements, and save the .svg — with nothing to install.

Q: Can I open and edit an existing .svg file?

Yes. You can open an existing .svg in the editor to tweak colors, resize or reposition elements, or remove parts you no longer need — without redrawing the whole graphic. When you are done, save it back out as a clean .svg file.

SVG is the quiet format behind nearly every crisp logo, app icon, and razor-sharp illustration you see on the web. The best part: you don't need an expensive design suite to make one. You can draw a vector graphic, tweak its colors, and save a proper .svg file right in your browser —. This guide explains what an SVG actually is, why vectors beat ordinary images, and how to create and edit one step by step.

What is an SVG?

SVG stands for Scalable Vector Graphics. Instead of storing a picture as a grid of colored dots, an SVG stores a set of instructions for drawing shapes: "draw a line from here to there," "fill this circle red," "follow this curve." It is an open, text-based format built on XML, so an SVG is literally readable code. Open one and you'll see tags like <svg>, <rect>, <circle>, <path>, and <text>. Each describes a shape with numbers and math rather than pixels. Because the recipe is math, the browser can redraw the image perfectly at any size.

Vector vs raster (PNG/JPG)

Most images you handle every day are raster images: PNG, JPG, GIF. A raster image is a fixed grid of pixels. It looks fine at its native size, but blow it up and the pixels stretch into a blurry, blocky mess — there's simply no extra detail to invent.

A vector image like SVG is different. Since it's defined by math, the browser recalculates every shape for whatever size you ask. Scale it to a tiny favicon or a wall-sized banner and the edges stay perfectly crisp. Vectors also tend to be far smaller in file size for flat artwork — a logo might be a few kilobytes of text instead of a heavy bitmap — and because the file is plain code, you can edit colors or shapes directly.

The trade-off is simple. Use vector (SVG) for logos, icons, line art, and illustrations that must stay sharp at any scale. Use raster (PNG/JPG) for photographs, where every pixel carries unique color information that math can't reasonably describe. Knowing which to reach for saves you a lot of grief later.

Create and edit SVG with Office Tools

You can make a vector graphic without installing anything. The free Office Tools SVG Editor runs entirely in your browser: draw shapes and paths, set fill and stroke (outline) colors, move, resize, and arrange your elements on the canvas, then save the result as a real .svg file. It's a desktop-oriented tool — the precision of a mouse and a larger canvas make vector work much easier — so reach for a laptop or desktop rather than a phone.

Open the SVG Editor in your browser. A blank canvas appears, ready to draw on.
Add shapes. Draw rectangles, circles, and lines for the basic structure, and use the path tool for custom curves and freeform outlines.
Set colors. Give each shape a fill (its interior color) and a stroke (its outline color and thickness) until it looks the way you want.
Arrange the elements. Move, resize, and reorder shapes on the canvas so they line up and stack correctly.
Save it. Export your work as an .svg file to your computer, ready to drop into a website, document, or another design tool.

Tip: build your graphic out of a few clean shapes rather than many tiny fragments. Simpler geometry is easier to recolor and resize later, and it keeps the saved file small.

Editing an existing SVG

You don't have to start from a blank canvas. Open an existing .svg in the editor and you can adjust it without redrawing anything: recolor a shape's fill or stroke, resize or reposition an element, or delete a part you no longer need. This is perfect for small tweaks — swapping a brand color, nudging an icon into alignment, or trimming an illustration down — then saving it back out as a clean .svg.

Tips for clean SVGs

Keep shapes simple. A few well-placed paths beat dozens of overlapping fragments. Simpler geometry renders faster and edits more easily.
Use consistent sizing. Decide on a canvas size and align elements to it so the graphic scales predictably wherever it's used.
Organize and name your elements. Grouping and labeling related shapes makes a complex graphic far easier to revisit and adjust.
Prefer flat color for icons. Solid fills keep icons legible at small sizes and keep the file tiny.
Test how it scales. View the graphic both very small and very large to confirm it stays crisp and balanced at every size.

Where SVGs shine

Vectors are the right tool whenever an image must look sharp no matter the screen or print size. Common cases include website logos and icons that must stay crisp on every display, from a phone to a 4K monitor; print-ready vector art that can be scaled up to poster size without losing quality; and illustrations and diagrams that need to remain clean across countless devices and zoom levels. Anywhere clarity at any size matters, SVG earns its place.

Related guides

Frequently asked questions

What is an SVG file?

SVG stands for Scalable Vector Graphics. It's an open, text-based (XML) format that describes an image as shapes — lines, curves, <path> elements, and text — using math instead of a fixed grid of pixels. Because it's math, an SVG scales to any size without blurring, stays small, and can be edited as plain code.

What's the difference between SVG and PNG?

PNG is raster — a fixed grid of pixels that blurs when enlarged. SVG is vector — shapes defined by math that stay sharp at any size. Use SVG for logos, icons, and line art; use PNG or JPG for photographs, which vectors can't represent well.

Do I need Illustrator to edit an SVG?

No. SVG is an open standard, so no paid design suite is required. The Office Tools SVG Editor lets you draw shapes and paths, set fill and stroke colors, move and resize elements, and save the .svg — with nothing to install.

Can I open and edit an existing .svg file?

Yes. Open an existing .svg in the editor to recolor it, resize or reposition elements, or remove parts you no longer need — without redrawing the whole graphic — then save it back out as a clean .svg.

온라인에서 SVG 파일 만들고 편집하는 법

SVG는 웹에서 보는 거의 모든 선명한 로고, 앱 아이콘, 칼같이 또렷한 일러스트 뒤에 조용히 자리한 형식입니다. 가장 좋은 점은, 비싼 디자인 프로그램이 없어도 하나 만들 수 있다는 것입니다. 브라우저에서 바로 벡터 그래픽을 그리고, 색을 바꾸고, 제대로 된 .svg 파일로 저장할 수 있습니다. 이 가이드는 SVG가 실제로 무엇인지, 왜 벡터가 일반 이미지보다 나은지, 그리고 단계별로 어떻게 만들고 편집하는지 설명합니다.

SVG란?

SVG는 Scalable Vector Graphics(확장 가능한 벡터 그래픽)의 약자입니다. 그림을 색점의 격자로 저장하는 대신, SVG는 도형을 그리기 위한 지시문의 집합을 저장합니다 — "여기서 저기까지 선을 그어라", "이 원을 빨강으로 채워라", "이 곡선을 따라가라". XML 기반의 개방형 텍스트 형식이라 SVG는 말 그대로 읽을 수 있는 코드입니다. 하나를 열어 보면 <svg>, <rect>, <circle>, <path>, <text> 같은 태그가 보입니다. 각각은 픽셀이 아니라 숫자와 수식으로 도형을 기술합니다. 이 설계도가 수학이기 때문에, 브라우저는 어떤 크기에서든 이미지를 완벽하게 다시 그릴 수 있습니다.

벡터 vs 래스터(PNG/JPG)

매일 다루는 대부분의 이미지는 래스터 이미지입니다 — PNG, JPG, GIF. 래스터 이미지는 고정된 픽셀 격자입니다. 원래 크기에서는 멀쩡하지만, 키우면 픽셀이 늘어나 흐릿하고 각진 덩어리가 됩니다 — 새로 만들어 낼 디테일이 애초에 없기 때문입니다.

SVG 같은 벡터 이미지는 다릅니다. 수식으로 정의되어 있으므로, 브라우저는 요청한 크기에 맞춰 모든 도형을 다시 계산합니다. 아주 작은 파비콘으로 줄이든 벽만 한 배너로 키우든 가장자리가 완벽하게 또렷하게 유지됩니다. 또한 단순한 평면 아트의 경우 벡터는 파일 크기가 훨씬 작은 경향이 있고 — 로고 하나가 무거운 비트맵 대신 텍스트 몇 킬로바이트일 수 있습니다 — 파일이 순수한 코드이므로 색이나 도형을 직접 편집할 수 있습니다.

절충은 간단합니다. 어떤 크기에서도 선명해야 하는 로고, 아이콘, 라인 아트, 일러스트에는 벡터(SVG)를 쓰세요. 모든 픽셀이 고유한 색 정보를 담고 있어 수식으로 합리적으로 기술하기 어려운 사진에는 래스터(PNG/JPG)를 쓰세요. 어느 쪽을 골라야 하는지 알면 나중에 큰 수고를 덜 수 있습니다.

Office Tools로 SVG 만들고 편집하기

아무것도 설치하지 않고 벡터 그래픽을 만들 수 있습니다. Office Tools SVG Editor는 브라우저 안에서 완전히 동작합니다 — 도형과 패스를 그리고, 채우기(fill)와 선(stroke, 외곽선) 색을 지정하고, 요소를 캔버스 위에서 이동·크기 조절·정렬한 뒤, 결과를 진짜 .svg 파일로 저장합니다. 데스크톱에 맞춘 도구입니다 — 마우스의 정밀함과 더 넓은 캔버스가 벡터 작업을 훨씬 수월하게 해 주므로, 휴대폰보다는 노트북이나 데스크톱을 이용하세요.

브라우저에서 SVG Editor를 엽니다. 그릴 준비가 된 빈 캔버스가 나타납니다.
도형을 추가합니다. 기본 구조는 사각형, 원, 선으로 그리고, 자유로운 곡선이나 형태는 패스 도구로 그립니다.
색을 지정합니다. 각 도형에 채우기(내부 색)와 선(외곽선 색과 두께)을 원하는 모습이 될 때까지 설정합니다.
요소를 배치합니다. 도형을 이동·크기 조절하고 순서를 바꿔 서로 정렬되고 올바르게 겹치도록 만듭니다.
저장합니다. 작업물을 .svg 파일로 컴퓨터에 내보내면, 웹사이트·문서·다른 디자인 도구에 바로 넣을 수 있습니다.

팁: 그래픽을 작은 조각 여러 개가 아니라 깔끔한 도형 몇 개로 구성하세요. 단순한 형상은 나중에 다시 칠하거나 크기를 바꾸기 쉽고, 저장 파일도 작게 유지됩니다.

기존 SVG 편집하기

반드시 빈 캔버스에서 시작할 필요는 없습니다. 기존 .svg를 편집기에서 열면 아무것도 다시 그리지 않고 손볼 수 있습니다 — 도형의 채우기나 선 색을 바꾸고, 요소의 크기나 위치를 조절하고, 더 이상 필요 없는 부분을 지웁니다. 브랜드 색을 교체하거나, 아이콘을 정렬에 맞게 살짝 옮기거나, 일러스트를 정리하는 작은 수정에 안성맞춤이며 — 끝나면 다시 깔끔한 .svg로 저장하면 됩니다.

깔끔한 SVG를 위한 팁

도형을 단순하게 유지하세요. 겹치는 조각 수십 개보다 잘 배치된 패스 몇 개가 낫습니다. 단순한 형상은 더 빠르게 렌더링되고 편집도 쉽습니다.
일관된 크기를 쓰세요. 캔버스 크기를 정하고 요소를 거기에 맞춰 정렬하면 어디에 쓰이든 그래픽이 예측 가능하게 확대·축소됩니다.
요소를 정리하고 이름을 붙이세요. 관련 도형을 묶고 이름표를 달면 복잡한 그래픽도 훨씬 쉽게 다시 보고 수정할 수 있습니다.
아이콘은 평면 색을 선호하세요. 단색 채우기는 작은 크기에서도 아이콘을 또렷하게 유지하고 파일도 작게 만듭니다.
확대·축소를 테스트하세요. 그래픽을 아주 작게도, 아주 크게도 보면서 모든 크기에서 선명하고 균형 있게 유지되는지 확인하세요.

SVG가 빛나는 곳

화면이나 인쇄 크기에 상관없이 이미지가 선명해야 할 때라면 언제나 벡터가 알맞은 도구입니다. 흔한 예로는 휴대폰부터 4K 모니터까지 모든 화면에서 또렷해야 하는 웹사이트 로고와 아이콘, 품질 저하 없이 포스터 크기까지 키울 수 있는 인쇄용 벡터 아트, 수많은 기기와 확대 수준에서도 깔끔하게 유지되어야 하는 일러스트와 다이어그램이 있습니다. 어떤 크기에서도 선명함이 중요한 곳이라면 SVG가 제 몫을 합니다.

자주 묻는 질문

SVG 파일이란 무엇인가요?

SVG는 Scalable Vector Graphics(확장 가능한 벡터 그래픽)의 약자입니다. 이미지를 선, 곡선, <path> 요소, 문자 같은 도형으로 — 고정된 픽셀 격자가 아니라 수식으로 — 기술하는 개방형 텍스트(XML) 형식입니다. 수식이기 때문에 SVG는 어떤 크기로도 흐려지지 않고 확대되며, 작고, 순수한 코드로 편집할 수 있습니다.

SVG와 PNG의 차이는 무엇인가요?

PNG는 래스터 — 키우면 흐려지는 고정된 픽셀 격자입니다. SVG는 벡터 — 수식으로 정의되어 어떤 크기에서도 또렷한 도형입니다. 로고, 아이콘, 라인 아트에는 SVG를, 벡터로 잘 표현하기 어려운 사진에는 PNG나 JPG를 쓰세요.

SVG를 편집하려면 일러스트레이터가 필요한가요?

아니요. SVG는 개방형 표준이라 유료 디자인 프로그램이 필요 없습니다. Office Tools SVG Editor에서 도형과 패스를 그리고, 채우기와 선 색을 지정하고, 요소를 이동·크기 조절하고, .svg로 저장할 수 있습니다 — 설치할 것도 없습니다.

기존 .svg 파일을 열어서 편집할 수 있나요?

네. 기존 .svg를 편집기에서 열어 전체를 다시 그리지 않고 색을 바꾸거나, 요소의 크기·위치를 조절하거나, 필요 없는 부분을 지운 뒤 — 다시 깔끔한 .svg 파일로 저장할 수 있습니다.

オンラインでSVGファイルを作成・編集する方法

SVGは、ウェブで見かけるほぼすべての鮮明なロゴ、アプリアイコン、シャープなイラストの背後で静かに支えている形式です。一番うれしいのは、高価なデザインソフトがなくても作れるということ。ブラウザの中でそのままベクターグラフィックを描き、色を調整し、きちんとした.svgファイルとして保存できます。このガイドでは、 SVGが実際に何なのか、なぜベクターが通常の画像より優れているのか、そして手順を追ってどう作成・編集するのかを説明します。

SVGとは?

SVGはScalable Vector Graphics(スケーラブル・ベクター・グラフィックス)の略です。画像を色付きの点のグリッドとして保存する代わりに、SVGは図形を描くための命令の集合を保存します —「ここからそこへ線を引く」「この円を赤で塗る」「このカーブをたどる」。XMLをベースにした、オープンなテキスト形式なので、SVGは文字どおり読めるコードです。ひとつ開いてみると、<svg>、<rect>、 <circle>、<path>、<text>といったタグが見えます。それぞれがピクセルではなく数値と数式で図形を記述します。この設計図が数学だからこそ、ブラウザはどんなサイズでも画像を完璧に描き直せるのです。

ベクター対ラスター(PNG/JPG)

毎日扱うほとんどの画像はラスター画像です — PNG、JPG、GIF。ラスター画像は固定されたピクセルのグリッドです。元のサイズではきれいに見えますが、拡大するとピクセルが引き伸ばされ、ぼやけてガタガタの塊になります — そもそも新しく生み出せるディテールがないからです。

SVGのようなベクター画像は違います。数式で定義されているので、ブラウザは要求されたサイズに合わせてすべての図形を計算し直します。ごく小さなファビコンに縮めても、壁ほどの大きさのバナーに拡大しても、エッジは完璧に鮮明なまま保たれます。また、平面的なアートでは、ベクターはファイルサイズがはるかに小さい傾向があり — ロゴひとつが重いビットマップではなく数キロバイトのテキストで済むこともあります — ファイルが純粋なコードなので、色や図形を直接編集できます。

トレードオフはシンプルです。どんなサイズでも鮮明でなければならないロゴ、アイコン、ラインアート、イラストにはベクター(SVG)を使いましょう。すべてのピクセルが固有の色情報を持ち、数式では合理的に記述しにくい写真にはラスター (PNG/JPG)を使いましょう。どちらを選べばよいかを知っておくと、後で多くの手間を省けます。

Office ToolsでSVGを作成・編集する

何もインストールせずにベクターグラフィックを作れます。 Office Tools SVG Editorはブラウザの中で完全に動作します — 図形やパスを描き、塗り(fill)と線(stroke、輪郭)の色を指定し、要素をキャンバス上で移動・サイズ変更・整列したうえで、結果を本物の.svgファイルとして保存します。デスクトップ向けのツールです — マウスの精度とより広いキャンバスがベクター作業をずっと楽にしてくれるので、スマートフォンよりノートパソコンやデスクトップを使いましょう。

ブラウザでSVG Editorを開きます。描き始める準備が整った空白のキャンバスが現れます。
図形を追加します。基本構造は長方形、円、線で描き、自由なカーブやフリーフォームの輪郭にはパスツールを使います。
色を指定します。各図形に塗り(内部の色)と線(輪郭の色と太さ)を、思いどおりの見た目になるまで設定します。
要素を配置します。図形を移動・サイズ変更し、順序を入れ替えて、きちんと整列し正しく重なるようにします。
保存します。作業を.svgファイルとしてパソコンに書き出せば、ウェブサイト・文書・別のデザインツールにそのまま取り込めます。

ヒント:グラフィックは小さな断片をたくさん使うのではなく、きれいな図形をいくつかで構成しましょう。シンプルな形状は後から塗り直したりサイズ変更したりしやすく、保存ファイルも小さく保てます。

既存のSVGを編集する

必ずしも空白のキャンバスから始める必要はありません。既存の.svgをエディタで開けば、何も描き直さずに調整できます — 図形の塗りや線の色を変えたり、要素のサイズや位置を調整したり、もう必要のない部分を削除したり。ブランドカラーを差し替えたり、アイコンを整列に合わせて少しずらしたり、イラストを整理したりといった小さな修正にぴったりで — 終わったら、ふたたびきれいな.svgとして保存すればよいのです。

きれいなSVGのためのヒント

図形をシンプルに保ちましょう。重なり合う数十個の断片より、よく配置されたパスがいくつかある方が優れています。シンプルな形状はより速くレンダリングされ、編集もしやすくなります。
一貫したサイズを使いましょう。キャンバスサイズを決めて要素をそれに合わせて整列すれば、どこで使われてもグラフィックが予測どおりに拡大・縮小します。
要素を整理し、名前を付けましょう。関連する図形をグループ化してラベルを付けると、複雑なグラフィックもずっと見直したり調整したりしやすくなります。
アイコンにはフラットな色を好みましょう。単色の塗りは小さなサイズでもアイコンを読みやすく保ち、ファイルも小さくします。
拡大・縮小をテストしましょう。グラフィックをとても小さくも、とても大きくも表示して、あらゆるサイズで鮮明かつバランスよく保たれるか確認しましょう。

SVGが活きる場面

画面や印刷のサイズに関係なく画像が鮮明でなければならないときは、いつでもベクターが適切なツールです。よくある例には、スマートフォンから4Kモニターまであらゆるディスプレイで鮮明でなければならないウェブサイトのロゴやアイコン、品質を損なわずにポスターサイズまで拡大できる印刷用ベクターアート、数えきれない端末やズームレベルで清潔に保たれる必要があるイラストや図表があります。どんなサイズでも鮮明さが重要な場所なら、SVGはその役目を果たします。

よくある質問

SVGファイルとは何ですか?

SVGはScalable Vector Graphics(スケーラブル・ベクター・グラフィックス)の略です。画像を、線、カーブ、<path>要素、文字といった図形として — 固定されたピクセルのグリッドではなく数式で — 記述する、オープンなテキスト(XML)形式です。数式なので、SVGはどんなサイズにもぼやけずに拡大でき、小さく、純粋なコードとして編集できます。

SVGとPNGの違いは何ですか?

PNGはラスター — 拡大するとぼやける固定されたピクセルのグリッドです。SVGはベクター — 数式で定義され、どんなサイズでも鮮明な図形です。ロゴ、アイコン、ラインアートには SVGを、ベクターではうまく表現できない写真にはPNGやJPGを使いましょう。

SVGを編集するのにIllustratorは必要ですか?

いいえ。SVGはオープンな標準なので、有料のデザインソフトは必要ありません。 Office Tools SVG Editorで、図形やパスを描き、塗りと線の色を指定し、要素を移動・サイズ変更し、.svgとして保存できます — インストールするものは何もありません。

既存の.svgファイルを開いて編集できますか?

はい。既存の.svgをエディタで開いて、全体を描き直さずに色を変えたり、要素のサイズや位置を調整したり、必要のない部分を削除したりしたうえで — ふたたびきれいな.svgファイルとして保存できます。

如何在线创建和编辑SVG文件

SVG是支撑你在网上看到的几乎每一个清晰的徽标、应用图标和锐利插图背后那个低调的格式。最妙的是:你不需要昂贵的设计软件就能制作一个。你可以在浏览器里直接绘制矢量图形、调整颜色,并保存一个真正的.svg文件。本指南将解释SVG究竟是什么、为什么矢量胜过普通图像,以及如何一步步创建和编辑它。

什么是SVG?

SVG代表Scalable Vector Graphics(可缩放矢量图形)。SVG并不是把图片存储为彩色点的网格,而是存储一组绘制形状的指令:"从这里到那里画一条线"、 "把这个圆填成红色"、"沿着这条曲线走"。它是一种基于XML的开放文本格式,所以SVG就是字面意义上可读的代码。打开一个,你会看到诸如<svg>、 <rect>、<circle>、<path>、 <text>之类的标签。每个标签都用数字和数学而非像素来描述一个形状。因为配方是数学,浏览器可以在任何尺寸下完美地重绘图像。

矢量 vs 栅格(PNG/JPG)

你每天处理的大多数图像是栅格图像:PNG、JPG、GIF。栅格图像是固定的像素网格。它在原始尺寸下看起来不错,但放大后像素会被拉伸成模糊、方块状的一团 — 因为根本没有额外的细节可以凭空生成。

像SVG这样的矢量图像则不同。由于它由数学定义,浏览器会为你要求的任何尺寸重新计算每一个形状。把它缩小成一个微小的网站图标,或放大成墙面大小的横幅,边缘都保持完美清晰。对于平面美术,矢量的文件体积通常也小得多 — 一个徽标可能只是几千字节的文本,而非沉重的位图 — 而且因为文件是纯代码,你可以直接编辑颜色或形状。

取舍很简单。对于必须在任何尺度下保持清晰的徽标、图标、线条画和插图,使用 矢量(SVG)。对于照片,使用栅格(PNG/JPG) — 照片中每个像素都携带独特的颜色信息,数学无法合理地描述。知道该选哪一个,能为你以后省去许多麻烦。

用Office Tools创建和编辑SVG

你无需安装任何东西就能制作矢量图形。 Office Tools SVG Editor完全在你的浏览器中运行:绘制形状和路径,设置填充(fill)和描边(stroke,轮廓)颜色,在画布上移动、调整大小和排列元素, 然后把结果保存为一个真正的.svg文件。它是一款面向桌面的工具 — 鼠标的精度和更大的画布让矢量工作轻松许多 — 所以请使用笔记本电脑或台式机,而不是手机。

在浏览器中打开SVG Editor。一张空白画布会出现,随时可以开始绘制。
添加形状。用矩形、圆形和线条绘制基本结构,用路径工具绘制自定义曲线和自由轮廓。
设置颜色。为每个形状设置填充(其内部颜色)和描边(其轮廓颜色与粗细),直到它呈现你想要的样子。
排列元素。在画布上移动、调整大小并重新排序形状,使它们对齐并正确堆叠。
保存它。把你的作品导出为.svg文件到电脑,即可直接放入网站、文档或另一个设计工具。

提示:用几个干净的形状来构建你的图形,而不是许多细小的碎片。更简单的几何形状以后更容易重新着色和调整大小,也能让保存的文件保持小巧。

编辑现有的SVG

你不必从空白画布开始。在编辑器中打开一个现有的.svg,你就可以在不重画任何东西的情况下调整它:重新为某个形状的填充或描边上色、调整某个元素的大小或位置, 或删除你不再需要的部分。这非常适合小调整 — 替换一个品牌色、把图标轻推到对齐位置, 或裁剪一幅插图 — 然后再把它保存为一个干净的.svg。

制作干净SVG的提示

保持形状简单。几条放置得当的路径胜过数十个重叠的碎片。更简单的几何形状渲染更快,也更容易编辑。
使用一致的尺寸。确定一个画布尺寸并让元素对齐它,这样无论在哪里使用,图形都能可预测地缩放。
整理并命名你的元素。把相关形状分组并加标签,会让复杂的图形日后重新查看和调整都容易得多。
图标优先使用纯色。纯色填充让图标在小尺寸下保持清晰,也让文件保持极小。
测试它如何缩放。把图形分别以很小和很大的方式查看,确认它在每个尺寸下都保持清晰和均衡。

SVG大放异彩的地方

每当一幅图像无论在何种屏幕或打印尺寸下都必须保持清晰时,矢量都是合适的工具。常见情形包括必须在从手机到4K显示器的每一种显示设备上都保持清晰的网站徽标和图标;可以放大到海报尺寸而不损失质量的可印刷矢量美术; 以及需要在无数设备和缩放级别下保持干净的插图和图表。在任何尺寸下清晰度都很重要的地方,SVG都能不负所托。

常见问题

什么是SVG文件?

SVG代表Scalable Vector Graphics(可缩放矢量图形)。它是一种开放的、基于文本(XML)的格式,用数学而非固定的像素网格,把图像描述为形状 — 线条、曲线、<path>元素和文字。因为是数学,SVG可以缩放到任何尺寸而不模糊,体积小,并且可以作为纯代码编辑。

SVG和PNG有什么区别?

PNG是栅格 — 一个放大时会模糊的固定像素网格。SVG是矢量 — 由数学定义、在任何尺寸下都保持清晰的形状。徽标、图标和线条画用SVG;矢量无法很好表现的照片用PNG或JPG。

编辑SVG需要Illustrator吗?

不需要。SVG是开放标准,所以不需要任何付费设计软件。 Office Tools SVG Editor让你绘制形状和路径,设置填充和描边颜色,移动和调整元素大小,并保存.svg — 无需安装任何东西。

我可以打开并编辑一个现有的.svg文件吗?

可以。在编辑器中打开一个现有的.svg,在不重画整幅图形的情况下重新着色、调整元素大小或位置,或移除你不再需要的部分 — 然后再把它保存为一个干净的.svg文件。

Cómo crear y editar archivos SVG en línea

SVG es el formato discreto que está detrás de casi todos los logotipos nítidos, iconos de aplicaciones e ilustraciones perfectamente afiladas que ves en la web. Lo mejor: no necesitas un costoso programa de diseño para crear uno. Puedes dibujar un gráfico vectorial, ajustar sus colores y guardar un archivo .svg en condiciones directamente en tu navegador. Esta guía explica qué es realmente un SVG, por qué los vectores superan a las imágenes corrientes y cómo crear y editar uno paso a paso.

¿Qué es un SVG?

SVG significa Scalable Vector Graphics (gráficos vectoriales escalables). En lugar de almacenar una imagen como una cuadrícula de puntos de color, un SVG guarda un conjunto de instrucciones para dibujar formas: "traza una línea de aquí hasta allá", "rellena este círculo de rojo", "sigue esta curva". Es un formato abierto, basado en texto y construido sobre XML, así que un SVG es literalmente código legible. Abre uno y verás etiquetas como <svg>, <rect>, <circle>, <path> y <text>. Cada una describe una forma con números y matemáticas en lugar de píxeles. Como la receta es matemática, el navegador puede redibujar la imagen a la perfección en cualquier tamaño.

Vectorial frente a rasterizado (PNG/JPG)

La mayoría de las imágenes que manejas a diario son imágenes rasterizadas: PNG, JPG, GIF. Una imagen rasterizada es una cuadrícula fija de píxeles. Se ve bien en su tamaño original, pero amplíala y los píxeles se estiran hasta convertirse en una masa borrosa y cuadriculada — sencillamente no hay detalle adicional que inventar.

Una imagen vectorial como SVG es distinta. Como está definida por matemáticas, el navegador recalcula cada forma para el tamaño que pidas. Redúcela a un diminuto favicon o amplíala a un cartel del tamaño de una pared y los bordes se mantienen perfectamente nítidos. Los vectores también tienden a ser mucho más pequeños en tamaño de archivo para el arte plano — un logotipo puede ser unos pocos kilobytes de texto en lugar de un mapa de bits pesado — y, como el archivo es código puro, puedes editar colores o formas directamente.

El compromiso es sencillo. Usa vectorial (SVG) para logotipos, iconos, arte lineal e ilustraciones que deban mantenerse nítidos a cualquier escala. Usa rasterizado (PNG/JPG) para fotografías, donde cada píxel lleva información de color única que las matemáticas no pueden describir de forma razonable. Saber por cuál decantarte te ahorra muchos disgustos más adelante.

Crea y edita SVG con Office Tools

Puedes hacer un gráfico vectorial sin instalar nada. El gratuito Office Tools SVG Editor funciona por completo en tu navegador: dibuja formas y trazados, fija los colores de relleno (fill) y de contorno (stroke), mueve, redimensiona y organiza tus elementos en el lienzo, y luego guarda el resultado como un archivo .svg real. Es una herramienta orientada al escritorio — la precisión de un ratón y un lienzo más grande hacen el trabajo vectorial mucho más fácil — así que recurre a un portátil o un ordenador de sobremesa antes que a un teléfono.

Abre el SVG Editor en tu navegador. Aparece un lienzo en blanco, listo para dibujar.
Añade formas. Dibuja rectángulos, círculos y líneas para la estructura básica, y usa la herramienta de trazado para curvas personalizadas y contornos libres.
Fija los colores. Da a cada forma un relleno (su color interior) y un contorno (el color y grosor de su borde) hasta que tenga el aspecto que quieres.
Organiza los elementos. Mueve, redimensiona y reordena las formas en el lienzo para que queden alineadas y se apilen correctamente.
Guárdalo. Exporta tu trabajo como un archivo .svg a tu ordenador, listo para colocarlo en un sitio web, un documento u otra herramienta de diseño.

Consejo: construye tu gráfico con unas pocas formas limpias en lugar de muchos fragmentos diminutos. Una geometría más simple es más fácil de recolorear y redimensionar después, y mantiene pequeño el archivo guardado.

Editar un SVG existente

No tienes que partir de un lienzo en blanco. Abre un .svg existente en el editor y podrás ajustarlo sin redibujar nada: recolorear el relleno o el contorno de una forma, redimensionar o recolocar un elemento, o eliminar una parte que ya no necesitas. Es perfecto para retoques pequeños — cambiar un color de marca, ajustar un icono a su alineación o recortar una ilustración — y luego guardarlo de nuevo como un .svg limpio.

Consejos para SVG limpios

Mantén las formas simples. Unos pocos trazados bien colocados superan a decenas de fragmentos superpuestos. Una geometría más simple se renderiza más rápido y se edita con más facilidad.
Usa un tamaño coherente. Decide un tamaño de lienzo y alinea los elementos a él para que el gráfico escale de forma predecible donde sea que se use.
Organiza y nombra tus elementos. Agrupar y etiquetar formas relacionadas hace que un gráfico complejo sea mucho más fácil de revisar y ajustar.
Prefiere el color plano para los iconos. Los rellenos sólidos mantienen los iconos legibles en tamaños pequeños y el archivo diminuto.
Comprueba cómo escala. Visualiza el gráfico tanto muy pequeño como muy grande para confirmar que se mantiene nítido y equilibrado en cada tamaño.

Dónde brillan los SVG

Los vectores son la herramienta adecuada siempre que una imagen deba verse nítida sin importar el tamaño de pantalla o de impresión. Casos habituales incluyen logotipos e iconos de sitios web que deben mantenerse nítidos en cada pantalla, desde un teléfono hasta un monitor 4K; arte vectorial listo para imprimir que puede ampliarse a tamaño de cartel sin perder calidad; e ilustraciones y diagramas que necesitan permanecer limpios en innumerables dispositivos y niveles de zoom. Dondequiera que importe la claridad a cualquier tamaño, SVG se gana su lugar.

Guías relacionadas

Preguntas frecuentes

¿Qué es un archivo SVG?

SVG significa Scalable Vector Graphics (gráficos vectoriales escalables). Es un formato abierto, basado en texto (XML), que describe una imagen como formas — líneas, curvas, elementos <path> y texto — usando matemáticas en lugar de una cuadrícula fija de píxeles. Como es matemática, un SVG escala a cualquier tamaño sin difuminarse, se mantiene pequeño y puede editarse como código puro.

¿Cuál es la diferencia entre SVG y PNG?

PNG es rasterizado — una cuadrícula fija de píxeles que se difumina al ampliarse. SVG es vectorial — formas definidas por matemáticas que se mantienen nítidas a cualquier tamaño. Usa SVG para logotipos, iconos y arte lineal; usa PNG o JPG para fotografías, que los vectores no pueden representar bien.

¿Necesito Illustrator para editar un SVG?

No. SVG es un estándar abierto, así que no hace falta ningún programa de diseño de pago. El Office Tools SVG Editor te permite dibujar formas y trazados, fijar los colores de relleno y contorno, mover y redimensionar elementos y guardar el .svg — sin nada que instalar.

¿Puedo abrir y editar un archivo .svg existente?

Sí. Abre un .svg existente en el editor para recolorearlo, redimensionar o recolocar elementos, o eliminar partes que ya no necesitas — sin redibujar todo el gráfico — y luego guárdalo de nuevo como un .svg limpio.

Comment créer et modifier des fichiers SVG en ligne

Le SVG est le format discret qui se cache derrière presque tous les logos nets, icônes d'applications et illustrations parfaitement précises que vous voyez sur le web. Le meilleur : vous n'avez pas besoin d'une coûteuse suite de design pour en créer un. Vous pouvez dessiner un graphique vectoriel, en ajuster les couleurs et enregistrer un véritable fichier .svg directement dans votre navigateur — gratuitement. Ce guide explique ce qu'est réellement un SVG, pourquoi les vecteurs surpassent les images ordinaires, et comment en créer et en modifier un étape par étape.

Qu'est-ce qu'un SVG ?

SVG signifie Scalable Vector Graphics (graphiques vectoriels évolutifs). Au lieu de stocker une image comme une grille de points colorés, un SVG enregistre un ensemble d'instructions pour dessiner des formes : « trace une ligne d'ici à là », « remplis ce cercle en rouge », « suis cette courbe ». C'est un format ouvert, basé sur le texte et construit sur XML, donc un SVG est littéralement du code lisible. Ouvrez-en un et vous verrez des balises comme <svg>, <rect>, <circle>, <path> et <text>. Chacune décrit une forme avec des nombres et des mathématiques plutôt qu'avec des pixels. Comme la recette est mathématique, le navigateur peut redessiner l'image à la perfection à n'importe quelle taille.

Vectoriel ou matriciel (PNG/JPG)

La plupart des images que vous manipulez au quotidien sont des images matricielles : PNG, JPG, GIF. Une image matricielle est une grille fixe de pixels. Elle est correcte à sa taille d'origine, mais agrandissez-la et les pixels s'étirent en une bouillie floue et en blocs — il n'y a tout simplement aucun détail supplémentaire à inventer.

Une image vectorielle comme le SVG est différente. Comme elle est définie par des mathématiques, le navigateur recalcule chaque forme pour la taille que vous demandez. Réduisez-la à un minuscule favicon ou agrandissez-la à une bannière de la taille d'un mur, et les bords restent parfaitement nets. Les vecteurs ont aussi tendance à être bien plus légers en taille de fichier pour les dessins plats — un logo peut représenter quelques kilo-octets de texte au lieu d'une lourde image bitmap — et comme le fichier est du code pur, vous pouvez modifier directement les couleurs ou les formes.

Le compromis est simple. Utilisez le vectoriel (SVG) pour les logos, icônes, dessins au trait et illustrations qui doivent rester nets à n'importe quelle échelle. Utilisez le matriciel (PNG/JPG) pour les photographies, où chaque pixel porte une information de couleur unique que les mathématiques ne peuvent raisonnablement décrire. Savoir lequel choisir vous évite bien des soucis par la suite.

Créer et modifier un SVG avec Office Tools

Vous pouvez réaliser un graphique vectoriel sans rien installer. Le gratuit Office Tools SVG Editor fonctionne entièrement dans votre navigateur : dessinez des formes et des tracés, définissez les couleurs de remplissage (fill) et de contour (stroke), déplacez, redimensionnez et organisez vos éléments sur le canevas, puis enregistrez le résultat sous forme de véritable fichier .svg. C'est un outil pensé pour le bureau — la précision d'une souris et un canevas plus grand rendent le travail vectoriel bien plus facile — alors privilégiez un ordinateur portable ou de bureau plutôt qu'un téléphone.

Ouvrez le SVG Editor dans votre navigateur. Un canevas vierge apparaît, prêt à accueillir votre dessin.
Ajoutez des formes. Dessinez des rectangles, des cercles et des lignes pour la structure de base, et utilisez l'outil de tracé pour des courbes personnalisées et des contours libres.
Définissez les couleurs. Donnez à chaque forme un remplissage (sa couleur intérieure) et un contour (la couleur et l'épaisseur de son bord) jusqu'à ce qu'elle ait l'aspect souhaité.
Disposez les éléments. Déplacez, redimensionnez et réordonnez les formes sur le canevas pour qu'elles s'alignent et se superposent correctement.
Enregistrez-le. Exportez votre travail sous forme de fichier .svg sur votre ordinateur, prêt à être intégré dans un site web, un document ou un autre outil de design.

Astuce : construisez votre graphique à partir de quelques formes nettes plutôt que de nombreux petits fragments. Une géométrie plus simple est plus facile à recolorer et à redimensionner par la suite, et garde le fichier enregistré léger.

Modifier un SVG existant

Vous n'êtes pas obligé de partir d'un canevas vierge. Ouvrez un .svg existant dans l'éditeur et vous pourrez l'ajuster sans rien redessiner : recolorer le remplissage ou le contour d'une forme, redimensionner ou repositionner un élément, ou supprimer une partie dont vous n'avez plus besoin. C'est parfait pour de petites retouches — remplacer une couleur de marque, recaler un icône dans son alignement ou rogner une illustration — puis l'enregistrer de nouveau sous forme de .svg propre.

Conseils pour des SVG propres

Gardez les formes simples. Quelques tracés bien placés valent mieux que des dizaines de fragments qui se chevauchent. Une géométrie plus simple s'affiche plus vite et se modifie plus facilement.
Utilisez une taille cohérente. Choisissez une taille de canevas et alignez les éléments dessus pour que le graphique s'adapte de façon prévisible où qu'il soit utilisé.
Organisez et nommez vos éléments. Regrouper et étiqueter les formes apparentées rend un graphique complexe bien plus facile à revoir et à ajuster.
Préférez la couleur unie pour les icônes. Les remplissages pleins gardent les icônes lisibles en petite taille et le fichier minuscule.
Testez son adaptation. Affichez le graphique à la fois très petit et très grand pour confirmer qu'il reste net et équilibré à chaque taille.

Là où les SVG brillent

Les vecteurs sont le bon outil dès qu'une image doit rester nette quelle que soit la taille d'écran ou d'impression. Parmi les cas courants : les logos et icônes de sites web qui doivent rester nets sur chaque affichage, d'un téléphone à un moniteur 4K ; l'art vectoriel prêt à imprimer qui peut être agrandi à la taille d'une affiche sans perte de qualité ; et les illustrations et schémas qui doivent rester propres sur d'innombrables appareils et niveaux de zoom. Partout où la clarté à n'importe quelle taille compte, le SVG gagne sa place.

Guides connexes

Questions fréquentes

Qu'est-ce qu'un fichier SVG ?

SVG signifie Scalable Vector Graphics (graphiques vectoriels évolutifs). C'est un format ouvert, basé sur le texte (XML), qui décrit une image sous forme de formes — lignes, courbes, éléments <path> et texte — à l'aide de mathématiques plutôt que d'une grille fixe de pixels. Comme c'est mathématique, un SVG s'adapte à n'importe quelle taille sans flou, reste léger et se modifie comme du code pur.

Quelle est la différence entre SVG et PNG ?

PNG est matriciel — une grille fixe de pixels qui devient floue lorsqu'on l'agrandit. SVG est vectoriel — des formes définies par des mathématiques qui restent nettes à n'importe quelle taille. Utilisez le SVG pour les logos, icônes et dessins au trait ; utilisez PNG ou JPG pour les photographies, que les vecteurs ne peuvent pas bien représenter.

Ai-je besoin d'Illustrator pour modifier un SVG ?

Non. Le SVG est un standard ouvert, donc aucune suite de design payante n'est nécessaire. Le Office Tools SVG Editor vous permet de dessiner des formes et des tracés, de définir les couleurs de remplissage et de contour, de déplacer et de redimensionner des éléments et d'enregistrer le .svg — sans rien à installer.

Puis-je ouvrir et modifier un fichier .svg existant ?

Oui. Ouvrez un .svg existant dans l'éditeur pour le recolorer, redimensionner ou repositionner des éléments, ou supprimer des parties dont vous n'avez plus besoin — sans redessiner tout le graphique — puis enregistrez-le de nouveau sous forme de .svg propre.

SVG-Dateien online erstellen und bearbeiten

SVG ist das unscheinbare Format hinter nahezu jedem gestochen scharfen Logo, jedem App-Symbol und jeder messerscharfen Illustration, die du im Web siehst. Das Beste daran: Du brauchst keine teure Design-Suite, um eines zu erstellen. Du kannst eine Vektorgrafik zeichnen, ihre Farben anpassen und eine richtige .svg-Datei direkt in deinem Browser speichern. Diese Anleitung erklärt, was ein SVG eigentlich ist, warum Vektoren gewöhnlichen Bildern überlegen sind und wie du Schritt für Schritt eines erstellst und bearbeitest.

Was ist ein SVG?

SVG steht für Scalable Vector Graphics (skalierbare Vektorgrafik). Statt ein Bild als Raster farbiger Punkte zu speichern, hält ein SVG eine Reihe von Anweisungen zum Zeichnen von Formen fest: „zieh eine Linie von hier nach dort", „füll diesen Kreis rot", „folge dieser Kurve". Es ist ein offenes, textbasiertes Format, das auf XML aufbaut, sodass ein SVG buchstäblich lesbarer Code ist. Öffne eines und du siehst Tags wie <svg>, <rect>, <circle>, <path> und <text>. Jedes beschreibt eine Form mit Zahlen und Mathematik statt mit Pixeln. Weil das Rezept Mathematik ist, kann der Browser das Bild in jeder Größe perfekt neu zeichnen.

Vektor vs. Raster (PNG/JPG)

Die meisten Bilder, mit denen du täglich umgehst, sind Rasterbilder: PNG, JPG, GIF. Ein Rasterbild ist ein festes Raster aus Pixeln. In seiner ursprünglichen Größe sieht es gut aus, doch vergrößere es und die Pixel werden zu einem verschwommenen, klobigen Brei auseinandergezogen — es gibt schlicht keine zusätzlichen Details zum Erfinden.

Ein Vektorbild wie SVG ist anders. Da es durch Mathematik definiert ist, berechnet der Browser jede Form für die gewünschte Größe neu. Verkleinere es auf ein winziges Favicon oder vergrößere es zu einem wandgroßen Banner, und die Kanten bleiben gestochen scharf. Vektoren sind bei flachen Grafiken zudem oft deutlich kleiner in der Dateigröße — ein Logo kann ein paar Kilobyte Text statt einer schweren Bitmap sein — und weil die Datei reiner Code ist, kannst du Farben oder Formen direkt bearbeiten.

Der Kompromiss ist einfach. Verwende Vektor (SVG) für Logos, Symbole, Strichgrafiken und Illustrationen, die in jeder Größe scharf bleiben müssen. Verwende Raster (PNG/JPG) für Fotografien, bei denen jedes Pixel eindeutige Farbinformationen trägt, die sich mit Mathematik nicht sinnvoll beschreiben lassen. Zu wissen, wozu man greift, erspart später viel Ärger.

SVG mit Office Tools erstellen und bearbeiten

Du kannst eine Vektorgrafik erstellen, ohne irgendetwas zu installieren. Der Office Tools SVG Editor läuft vollständig in deinem Browser: zeichne Formen und Pfade, lege Füllfarbe (fill) und Konturfarbe (stroke) fest, bewege, skaliere und ordne deine Elemente auf der Leinwand an und speichere das Ergebnis dann als echte .svg-Datei. Es ist ein für den Desktop gedachtes Werkzeug — die Präzision einer Maus und eine größere Leinwand machen die Vektorarbeit viel leichter — greife also lieber zu einem Laptop oder Desktop-Rechner als zu einem Handy.

Öffne den SVG Editor in deinem Browser. Eine leere Leinwand erscheint, bereit zum Zeichnen.
Füge Formen hinzu. Zeichne Rechtecke, Kreise und Linien für die Grundstruktur und nutze das Pfadwerkzeug für eigene Kurven und freie Umrisse.
Lege die Farben fest. Gib jeder Form eine Füllung (ihre Innenfarbe) und eine Kontur (Farbe und Stärke ihres Rands), bis sie so aussieht, wie du es möchtest.
Ordne die Elemente an. Bewege, skaliere und sortiere die Formen auf der Leinwand neu, damit sie bündig sitzen und korrekt übereinanderliegen.
Speichere es. Exportiere deine Arbeit als .svg-Datei auf deinen Computer, bereit zum Einfügen in eine Website, ein Dokument oder ein anderes Designwerkzeug.

Tipp: Baue deine Grafik aus wenigen sauberen Formen statt aus vielen winzigen Bruchstücken. Einfachere Geometrie lässt sich später leichter umfärben und skalieren und hält die gespeicherte Datei klein.

Ein bestehendes SVG bearbeiten

Du musst nicht von einer leeren Leinwand ausgehen. Öffne ein bestehendes .svg im Editor und du kannst es anpassen, ohne etwas neu zu zeichnen: die Füllung oder Kontur einer Form umfärben, ein Element skalieren oder verschieben oder einen Teil löschen, den du nicht mehr brauchst. Das ist perfekt für kleine Anpassungen — eine Markenfarbe austauschen, ein Symbol in die Ausrichtung rücken oder eine Illustration zurechtstutzen — und es dann wieder als sauberes .svg zu speichern.

Tipps für saubere SVGs

Halte die Formen einfach. Ein paar gut platzierte Pfade schlagen Dutzende überlappender Bruchstücke. Einfachere Geometrie rendert schneller und lässt sich leichter bearbeiten.
Verwende einheitliche Größen. Lege eine Leinwandgröße fest und richte die Elemente daran aus, damit die Grafik überall, wo sie verwendet wird, vorhersehbar skaliert.
Organisiere und benenne deine Elemente. Zusammengehörige Formen zu gruppieren und zu beschriften macht eine komplexe Grafik weit einfacher erneut aufzurufen und anzupassen.
Bevorzuge flache Farben für Symbole. Vollflächige Füllungen halten Symbole in kleinen Größen lesbar und die Datei winzig.
Teste, wie es skaliert. Betrachte die Grafik sowohl sehr klein als auch sehr groß, um zu bestätigen, dass sie in jeder Größe scharf und ausgewogen bleibt.

Wo SVGs glänzen

Vektoren sind das richtige Werkzeug, sobald ein Bild unabhängig von Bildschirm- oder Druckgröße scharf aussehen muss. Häufige Fälle sind Website-Logos und -Symbole, die auf jedem Display scharf bleiben müssen, vom Handy bis zum 4K-Monitor; druckfertige Vektorgrafik, die sich ohne Qualitätsverlust auf Plakatgröße vergrößern lässt; und Illustrationen und Diagramme, die über unzählige Geräte und Zoomstufen hinweg sauber bleiben müssen. Überall, wo Schärfe in jeder Größe zählt, verdient sich SVG seinen Platz.

Häufig gestellte Fragen

Was ist eine SVG-Datei?

SVG steht für Scalable Vector Graphics (skalierbare Vektorgrafik). Es ist ein offenes, textbasiertes (XML) Format, das ein Bild als Formen — Linien, Kurven, <path>-Elemente und Text — mithilfe von Mathematik statt eines festen Pixelrasters beschreibt. Weil es Mathematik ist, skaliert ein SVG ohne Unschärfe auf jede Größe, bleibt klein und lässt sich als reiner Code bearbeiten.

Was ist der Unterschied zwischen SVG und PNG?

PNG ist Raster — ein festes Pixelraster, das beim Vergrößern unscharf wird. SVG ist Vektor — durch Mathematik definierte Formen, die in jeder Größe scharf bleiben. Verwende SVG für Logos, Symbole und Strichgrafiken; verwende PNG oder JPG für Fotografien, die Vektoren nicht gut darstellen können.

Brauche ich Illustrator, um ein SVG zu bearbeiten?

Nein. SVG ist ein offener Standard, daher ist keine kostenpflichtige Design-Suite nötig. Der Office Tools SVG Editor lässt dich Formen und Pfade zeichnen, Füll- und Konturfarben festlegen, Elemente bewegen und skalieren und das .svg speichern — ganz ohne Installation.

Kann ich eine bestehende .svg-Datei öffnen und bearbeiten?

Ja. Öffne ein bestehendes .svg im Editor, um es umzufärben, Elemente zu skalieren oder zu verschieben oder Teile zu entfernen, die du nicht mehr brauchst — ohne die ganze Grafik neu zu zeichnen — und speichere es dann wieder als sauberes .svg.