SVG 회전
☞ 모든 처리가 브라우저 안에서 이루어집니다 — 아무것도 업로드되지 않습니다여기에 SVG를 놓으세요
또는 클릭해서 찾기 — SVG만 가능
미리보기
SVG 회전
SVG를 90° 단위로 돌리거나 원하는 방향으로 뒤집으세요. 그림은 하나의 transform으로 감싸지므로, 파일 안의 모든 패스가 디자이너가 남긴 그대로 유지됩니다.
또는 클릭해서 찾기 — SVG만 가능
미리보기
transform 한 줄
사진을 회전한다는 것은 모든 픽셀을 다시 표본화한다는 뜻입니다. SVG를 회전한다는 것은 transform 하나를 적는 일입니다. 그림이 캔버스를 축으로 도는 그룹에 감싸이고, 캔버스 쪽 — viewBox와 width·height — 은 회전이 90°나 270°일 때 두 변을 맞바꿉니다. 여러분의 패스 좌표는 하나도 다시 쓰이지 않습니다.
결과가 정확한 이유도 여기에 있습니다. 보간도, 흐릿해진 가장자리도, 네 번 돌린 뒤의 어긋남도 없습니다. 90°를 네 번 돌리면 원본 파일이 바이트 단위로 그대로 돌아옵니다.
세 단계
.svg 파일을 고르세요 — 파일은 기기에 남습니다.
90°씩 단계로 돌리고, 원하는 축으로 뒤집고, 둘을 겹칠 수도 있습니다.
같은 그림, 새로운 방향.
간단한 답변
여기서는 안 됩니다. 90° 단위에서는 캔버스가 그림에 정확히 들어맞지만 37°에서는 그렇지 않아, 여백과 더 큰 viewBox, 그리고 모서리를 어떻게 처리할지에 대한 판단이 필요해집니다. 아이콘 방향 맞추기, 옆으로 누운 내보내기 고치기 같은 실제 용도는 90° 단위로 충분하고, 결과도 정확히 예측할 수 있습니다.
거의 아닙니다. transform 속성이 붙은 그룹 요소 하나가 추가되고, viewBox와 크기 속성이 갱신될 뿐입니다. 패스, 그러데이션, 클래스, id는 그대로입니다.
달라진 게 아니라, 화면에 보이는 것을 따르는 것입니다. '좌우'는 언제나 화면상에서 왼쪽과 오른쪽을 뒤집으며, 90° 돌린 뒤에는 그것이 원본 파일의 다른 축에 해당할 뿐입니다. 이미지 편집기에서 누구나 기대하는 동작입니다.
title, desc, style, metadata, defs는 원래 있어야 할 최상위에 그대로 남습니다. 회전하는 그룹 안으로 들어가는 것은 그림 자체뿐이라, 스크린 리더가 이미지를 읽는 방식도 달라지지 않습니다.
파일의 width와 height에 맞춰 하나를 추가해 드립니다. viewBox가 없으면 두 변을 맞바꿀 캔버스도 없어서, 90° 회전이 그림을 보이는 영역 밖으로 밀어내게 됩니다.
아니요. 파일은 브라우저 안에서 해석되고 다시 쓰입니다.