[SVG] SVG 만드는 법

SVG 만드는 법

SVG 파일을 만드는 방법은 몇 가지가 있습니다. 가장 보편적인 방법은 벡터 그래픽 편집 소프트웨어를 사용하는 것입니다. Adobe Illustrator나 Inkscape와 같은 프로그램이 이에 해당합니다. 또 다른 방법은 HTML과 CSS를 사용해 직접 코드를 작성하는 것입니다. 이 방법은 프로그래밍 지식이 필요하지만, 매우 세밀하고 특정한 디자인을 만들 수 있습니다.

1. 벡터 그래픽 편집 소프트웨어 사용하기 (예: Adobe Illustrator, Inkscape)
   • 프로그램을 열고 새로운 문서를 생성합니다.
   • 도구를 사용하여 원하는 그래픽을 디자인합니다.
   • 작업이 끝나면 '파일' 메뉴에서 '다른 이름으로 저장'을 선택합니다.
   • 파일 형식으로 'SVG'를 선택하고 저장합니다.
2. HTML과 CSS를 사용하여 SVG 파일 직접 만들기
   • 텍스트 편집기를 열고 새 파일을 생성합니다.
   • <svg> 태그를 사용하여 SVG 요소를 시작합니다.
   • SVG 내에 원하는 모양을 그리기 위해 <circle>, <rect>, <path> 등의 태그를 사용합니다.
   • 스타일링을 위해 CSS를 사용할 수 있습니다.
   • 파일을 '.svg' 확장자를 사용하여 저장합니다.

예를 들어, 간단한 원을 SVG로 만드는 코드는 다음과 같습니다:

<svg width="100" height="100" xmlns="http://www.w3.org/2000/svg">
  <circle cx="50" cy="50" r="40" stroke="green" stroke-width="4" fill="yellow" />
</svg>

이 코드는 중심이 (50, 50)이고 반지름이 40인 원을 만들며, 녹색 테두리와 노란색 채우기를 가집니다. 이 파일을 .svg 확장자로 저장하면 SVG 파일이 됩니다.

caption: svg파일 작성

caption: 만들어진 벡터 이미지

정리

SVG 파일을 만들 때는 정밀도와 확장성이 중요합니다. 벡터 기반으로 만들어진 SVG는 확대해도 품질이 떨어지지 않으며, 웹에서도 자주 사용됩니다. 따라서 웹 페이지나 프린트 미디어에 사용하기에 적합합니다.