Google Web Designer의 SVG

SVG는 벡터 그래픽에 사용되는 XML 기반의 이미지 형식입니다. SVG 이미지는 품질 손상 없이 크기를 조절할 수 있으므로 반응형 레이아웃에서 특히 유용합니다.

SVG 추가 방법

다음과 같이 여러 가지 방법으로 문서에 SVG를 추가할 수 있습니다.

• SVG 파일 가져오기(자세한 내용은 아래 참조)
• 펜 및 도형 도구를 사용하여 SVG 도형 그리기
• 코드 보기에 직접 SVG 코드 삽입하기
• 디자인 보기에서 SVG 코드 붙여넣기
• SVG 필터를 적용하여 텍스트 요소를 SVG로 변환하기

SVG 파일 가져오기

파일 > 애셋 가져오기... 메뉴 명령을 사용하거나 파일을 Google Web Designer 창으로 드래그하여 SVG 파일을 가져올 수 있습니다.

SVG 파일을 가져오는 경우 SVG를 이미지로 취급하는 것과 문서의 HTML 내에 SVG 코드 인라인을 삽입하는 것 중에서 선택할 수 있습니다. 아래 표에는 각 방법의 몇 가지 사용 사례가 나와 있습니다.

SVG 필터

SVG 필터를 사용하여 SVG 요소에 블러, 발광 효과와 같은 특별한 효과를 추가할 수 있습니다. SVG 필터의 전체 목록을 참조하세요.