PNG를 SVG로 변환 Portable Network Graphics ↔ Scalable Vector Graphics 무료 온라인 안전

사람들이 PNG를 SVG로 변환하는 이유

PNG는 색깔 점의 격자입니다. SVG는 도형으로 설명된 도면입니다. 이 차이가 둘로 할 수 있는 일을 정합니다. PNG는 크기가 고정되어 있고 확대하면 흐려지는 반면, SVG는 건물 옆면 크기로 확대해도 선명하게 남습니다. 로고, 아이콘, 선화는 그렇게 저장되거나 전달되었다는 이유로 PNG로만 있는 경우가 많고, 그러면 더 크게 쓰거나, 색을 바꾸거나, 플로터나 비닐 커터로 자르거나, SVG를 요구하는 사이트에 올려야 할 일이 생깁니다. 그래서 사람들이 PNG를 SVG로 변환합니다. 그림이 있는데 도면을 원하는 것입니다.

이런 변환이 할 수 있는 일과 할 수 없는 일에 대해 솔직한 것이 중요합니다. 픽셀을 다시 도형으로 바꾸는 것은 사라진 원래 도면의 복원이 아닙니다. 평평한 색의 영역이 어디서 끝나는지 보고 하는 짐작입니다. 로고, 아이콘, 선화라면 짐작이 거의 맞는 경우가 많습니다. 사진이라면 거의 쓸모가 없습니다. 이 페이지는 두 가지 선택지를 제공하며, 시간을 들이기 전에 각각의 대가를 알려 줍니다. 트레이싱으로 그림을 도형으로 만들 수도 있고, 온 그대로 SVG에 싸서 유지할 수도 있습니다.

이 페이지는 브라우저 안에서 PNG를 SVG로 변환합니다. 그림은 서버로 업로드되지 않으며, 아직 공개되지 않은 로고와 디자인에 중요한 점입니다. 아래에서 트레이싱이 어떻게 작동하는지, 색 수를 어떻게 고르는지, 무엇이 유지되는지, 아예 트레이싱하지 않는 것이 더 나은 답일 때가 언제인지 확인하실 수 있습니다.

변환이 작동하는 방식

그림에 무슨 일이 일어날지에 대한 두 가지 선택

그림이 어떻게 될지 고릅니다. 도형이 되거나, 온 그대로 남거나입니다. 첫째는 트레이싱입니다. 그림을 분석해 한 색의 영역을 찾고, 그 경계를 요청한 색으로 채운 도형으로 씁니다. 둘째는 싸기입니다. 그림이 변하지 않은 채 SVG 파일 안에 놓이므로, 파일은 바깥이 SVG이고 안은 같은 픽셀입니다.

트레이싱은 짐작이지 복원이 아닙니다

트레이싱은 평평한 색 영역이 어디서 끝나는지 찾아 그 경계를 도형으로 씁니다. 로고, 아이콘, 선화에는 거의 맞고, 조각으로 된 포스터를 만들어 내는 사진에는 거의 쓸모가 없습니다. 부드러운 가장자리와 그라데이션은 요청한 색 사이의 단단한 계단이 됩니다. 허용하는 색이 많을수록 결과가 원본에 가까워지고 파일은 무거워집니다.

그림을 유지하기

그림을 대신 유지하면 바깥은 SVG이고 안은 같은 픽셀인 파일을 얻습니다. 무언가가 .svg만 받을 때 유용하며 벡터 그림을 얻는 방법은 아닙니다. 그림은 PNG가 그랬듯 확대하면 흐려집니다.

유지되는 것

어느 쪽을 고르든 투명도

어느 쪽을 고르든 투명도는 유지됩니다. 비치는 배경은 흰색이 되지 않고 빈 채로 남습니다. 배경 없는 로고는 배경 없는 로고로 남아 어떤 색 위에도 놓일 수 있습니다.

비율과 크기

트레이싱은 그림의 비율과 자체 픽셀 크기를 SVG의 너비와 높이에 유지하므로, 레이아웃에 원래 크기로 들어갑니다. 600 곱하기 300 픽셀의 그림은 600 곱하기 300으로 선언된 SVG를 주며, 그런 다음 자유롭게 확대할 수 있습니다.

PNG를 SVG로 변환하기 전에 알아야 할 것

평평한 색에서 가장 잘 됩니다

로고, 아이콘, 단순한 일러스트레이션, 서명, 도장, 도표, 선화가 알맞은 재료입니다. 깔끔한 경계를 가진 평평한 색 영역으로 이루어진 모든 것이 잘 트레이싱됩니다. 사진, 질감, 부드러운 그라데이션은 그렇지 않습니다.

큰 그림은 줄인 크기로 읽습니다

긴 쪽이 1000 픽셀보다 큰 그림은 그 크기로 읽힙니다. SVG는 여전히 원래 크기를 담고 있고 벡터이므로 다시 확대됩니다. 그래서 아주 큰 PNG도 문제가 없지만 가장 고운 세부는 읽는 과정에서 사라질 수 있습니다.

색이 적을수록 도형이 깔끔합니다

그림에 맞게 색 수를 고르십시오. 두 가지 색의 로고에는 두세 가지 색이 알맞습니다. 여러 색의 일러스트레이션은 더 필요합니다. 색이 너무 많으면 도형이 지저분해지고, 너무 적으면 서로 다른 영역이 합쳐집니다.

여기서 PNG를 SVG로 변환하는 방법

그림 추가

PNG를 페이지에 끌어다 놓거나 기기에서 고르십시오. 브라우저 안에서 읽히며 업로드되지 않습니다.

트레이싱 또는 유지, 그리고 색 고르기

그림이 도형이 될지 온 그대로 남을지 정하십시오. 트레이싱한다면 색 수를 설정하십시오.

변환하고 비교하기

버튼을 누르고 SVG를 내려받으십시오. 브라우저에서 열어 확대해 보십시오. 좋은 트레이싱은 매끄럽게 남습니다. PNG와 나란히 견주어 보고 맞지 않으면 색을 조정해 다시 시도하십시오.

PNG와 SVG 자세히 보기

래스터와 벡터

PNG는 래스터 형식입니다. 색깔 점의 고정된 격자를 저장합니다. SVG는 벡터 형식입니다. 도형과 그리는 규칙을 저장합니다. 래스터에서 벡터로 가는 것은 PNG가 한 번도 기록하지 않은 도형이 어디 있는지 정하는 일입니다. 반대로 가는 SVG를 PNG로는 정확합니다. 이 방향은 추정입니다.

트레이싱이 원본을 복원하지 못하는 이유

로고가 PNG로 저장될 때 곡선은 점으로 바뀌었고 가장자리에서 일부 정보가 사라졌습니다. 트레이싱은 점을 읽고 그것을 지나는 곡선을 제안합니다. 제안은 아주 좋은 경우가 많지만 원래의 곡선은 아닙니다. 원본 SVG가 있다면 그것을 쓰십시오.

트레이싱을 피할 때

사진은 트레이싱하지 마십시오. 트레이싱이 작은 로고의 고운 글자꼴을 재현하리라 기대하지도 마십시오. 그런 것은 그림을 온 그대로 두거나 PNG를 안내로 삼아 드로잉 프로그램에서 그림을 다시 그리십시오.

흔한 상황을 자세히

PNG로만 있는 로고

고객이 로고를 PNG로 보냈는데 더 크게 또는 색을 바꿔 써야 합니다. PNG를 SVG로 변환하고, 결과를 확인하고, 드로잉 프로그램에서 다듬으십시오. 단순한 로고라면 결과가 훌륭할 수 있습니다.

절단과 조각

플로터, 비닐 커터, 레이저 조각기는 벡터 윤곽선으로 작업합니다. 실루엣이나 도장을 트레이싱한 SVG는 그들에게 필요한 것을 줍니다.

아이콘과 단순한 일러스트레이션

평평한 아이콘은 거의 완벽하게 트레이싱됩니다. 그런 다음 색을 바꾸고, 확대하고, 웹에서 손실 없이 쓸 수 있습니다.

서명과 도장

흰 배경에 스캔하거나 촬영한 서명은 문서에서 깔끔하게 확대되는 단색 SVG로 트레이싱할 수 있습니다. 자신의 서명만 쓰도록 주의하십시오.

PNG를 SVG로 변환하기 전의 실용적 조언

가진 것 중 가장 크고 깨끗한 PNG로 시작하기

픽셀이 많고 가장자리가 깨끗할수록 트레이싱이 좋습니다. 작고 흐릿한 그림은 울퉁불퉁한 결과를 줍니다.

먼저 잡음 제거하기

반점, 떠도는 점, 압축 아티팩트는 추가 도형이 됩니다. 가능하다면 PNG를 SVG로 변환하기 전에 편집기에서 그림을 정리하십시오.

높은 대비 쓰기

구분된 색은 잘 트레이싱됩니다. 두 영역이 거의 같은 색조인 그림은 둘을 하나로 합칠 수 있습니다.

PNG를 보관하기

PNG가 원본입니다. 트레이싱이 좋지 않으면 다른 설정으로 다시 시도하기 위해 필요할 것입니다.

변환하기 전에 사람들이 묻는 질문

원래의 벡터를 되찾을 수 있나요?

아니요. 트레이싱은 짐작이지 복원이 아닙니다. 그림 속 색의 경계를 따르는 도형을 제안합니다.

사진이 왜 포스터처럼 보이나요?

사진에는 찾을 평평한 영역이 없기 때문입니다. 트레이싱은 사진을 색 조각으로 바꿉니다. 사진은 온 그대로 유지하십시오.

투명도가 유지되나요?

네, 어느 쪽을 고르든 그렇습니다. 비치는 배경은 빈 채로 남습니다.

그림을 유지하면 어떻게 되나요?

바깥은 SVG이고 안은 같은 픽셀인 파일을 줍니다. 무언가가 .svg만 받을 때 유용합니다.

그림이 업로드되나요?

아니요. 변환은 브라우저 안에서 실행되며 그림은 기기를 떠나지 않습니다.

PNG로 돌아갈 수 있나요?

네. SVG를 PNG로가 고른 크기로 도형을 그립니다.

PNG를 SVG로 변환할 때 현명하게 고르기

트레이싱할까, 유지할까?

평평한 그림은 트레이싱하십시오. 사진과 세부가 많은 것은 유지하십시오. 확신이 없다면 트레이싱해 보고 결과를 원본 옆에서 보십시오.

다른 출발점

그림이 JPG라면 JPG를 SVG로가 같은 방식으로 작동하지만 압축 잡음에 주의가 필요합니다. 아이콘 파일에는 ICO를 SVG로가 그 안의 가장 큰 크기를 읽습니다.

처음 가진 것을 보관하기

PNG를 SVG 옆에 보관하십시오. 서로 다른 것이며 각각 쓸모가 있습니다.

변환 뒤에 좋은 결과 얻기

드로잉 프로그램에서 열기

도형과 색을 살펴보십시오. 떠도는 반점을 지우고, 하나여야 할 도형을 합치고, 울퉁불퉁하게 나온 곡선을 매끄럽게 하십시오.

여러 크기에서 확인하기

확대하고 축소해 보십시오. 좋은 트레이싱은 어느 크기에서도 모양을 유지합니다.

웹용으로 단순화하기

트레이싱한 SVG에는 점이 많을 수 있습니다. 경로를 단순화하는 도구는 눈에 보이는 변화 없이 파일을 상당히 줄일 수 있습니다.

잘 트레이싱되도록 PNG 준비하기

색을 평평하게 하기

평평해야 할 영역에 옅은 그라데이션이나 잡음이 있다면 먼저 편집기에서 색 수를 줄이십시오. PNG를 SVG로 변환할 때 트레이싱이 더 깔끔해집니다.

바싹 자르기

빈 여백과 그림의 일부가 아닌 것을 제거하십시오. 트레이싱할 것이 적으면 떠도는 도형이 줄어듭니다.

먼저 작은 조각으로 시험하기

그림이 복잡하다면 먼저 잘라 낸 부분을 트레이싱하십시오. 빠르게 보면 설정이 맞는지 알 수 있습니다.

PNG를 SVG로 변환할 때 최상의 트레이싱 얻기

예상하는 색으로 시작하기

PNG를 SVG로 변환하기 전에 그림의 색을 세어 보십시오. 파랑, 하양, 검정을 쓰는 로고는 셋, 투명한 배경까지 치면 아마 넷을 요구합니다. 그 수를 요청하면 디자인에 맞는 깔끔한 도형을 얻습니다. 스물을 요청하면 도구가 압축 잡음 속에서 조금씩 다른 스무 가지 파랑을 찾아 각각을 자기 도형으로 그리라고 부추기게 됩니다.

가장자리에 유의하기

PNG에서 두 색 사이의 경계는 그림이 그려질 때 매끄럽게 처리되었기 때문에 보통 중간 색조의 부드러운 선입니다. 트레이싱은 그 부드러운 선 안에서 가장자리가 어디에 있는지 정해야 합니다. 중간을 고르는데 거의 언제나 맞지만, 아주 가는 선은 조각으로 끊기거나 굵어질 수 있습니다. 그림의 선이 한두 픽셀 너비에 불과하다면 더 큰 버전의 그림에서 시작하십시오.

흰색에 대해 생각하기

흰색은 그림의 색일 수도, 빈 배경일 수도 있습니다. PNG에 투명한 배경이 있다면 빈 채로 남아 아무것도 할 필요가 없습니다. 배경이 투명도 없는 흰 종이라면 트레이싱은 그림 뒤의 흰 도형으로 그것을 포함하며, 로고가 다른 색 위에 깔끔하게 놓이도록 드로잉 프로그램에서 지우고 싶을 수 있습니다.

SVG를 마땅한 크기로 쓰기

결과의 큰 장점은 확대된다는 것입니다. 포스터, 간판, 자수 패치, 파비콘에 쓰고 더 큰 파일을 요청하지 않아도 되는 것을 즐기십시오. 픽셀 그림이 다시 필요하면 SVG를 PNG로가 고른 어떤 크기로도 도형을 그립니다.

다시 그리기와 견주기

중요한 로고라면 트레이싱은 끝이 아니라 출발점일 수 있습니다. 디자이너는 트레이싱한 도형을 레이어에 놓고, 깔끔한 점으로 곡선을 다시 그려, 작업하기 즐거운 파일을 얻을 수 있습니다. 로고가 회사의 얼굴이라면 그 한 시간은 잘 쓴 시간입니다. 일상의 필요에는 좋은 트레이싱으로 충분합니다.

상표와 다른 사람의 작품에 주의하기

로고나 그림을 트레이싱한다고 그것에 대한 권리가 생기는 것은 아닙니다. 소유하거나 사용 허가를 받은 그림에만 변환을 쓰십시오. 자신의 표시에는 옛 그림을 최신으로 만드는 편리한 방법입니다.

마음에 든 설정을 간직하기

특정 종류의 그림에 통하는 색 수를 찾으면 적어 두십시오. 다음에 비슷한 로고나 아이콘을 PNG에서 SVG로 변환할 때 깔끔한 도형을 준다고 아는 설정에서 시작할 수 있습니다.

개인정보와 처리

그림에 로컬 변환이 중요한 이유

로고와 디자인은 게시되기 전에는 기밀일 수 있습니다. 많은 온라인 변환기는 파일을 서버에 올려 처리하고 결과를 돌려보내며, 한동안 사본이 통제할 수 없는 기계에 존재합니다. 여기서는 브라우저가 직접 작업하므로 그림은 기기에 남습니다.

떠날 때 일어나는 일

페이지를 닫으면 변환된 파일이 브라우저에서 사라지므로 먼저 내려받으십시오. 그림에 관한 어떤 것도 보관되지 않습니다.

문제가 생겼을 때

트레이싱이 반점으로 가득합니다

그림에 잡음이 있었습니다. 편집기에서 정리하거나 색 수를 줄이십시오.

도형이 너무 거칩니다

색 수를 늘리거나 더 큰 PNG로 시작하십시오.

큰 그림에서 페이지가 멈춥니다

모든 것이 기기에서 실행되며 큰 그림은 메모리가 필요합니다. 컴퓨터에서 다시 시도하거나 먼저 그림을 줄이십시오.

관련 도구

같은 계열의 도구가 이웃한 일을 다룹니다. JPG에는 JPG를 SVG로를, 아이콘 파일에는 ICO를 SVG로를 쓰십시오. 픽셀로 돌아가려면 SVG를 PNG로, SVG를 JPG로, SVG를 ICO로가 고른 크기로 도형을 그립니다. 인쇄용 벡터 페이지는 SVG를 PDF로에서, 더 가벼운 PNG는 PNG 압축에서 얻습니다.

계산 사례

작은 사업체가 흰 글자가 든 파란 방패인 500 곱하기 500 픽셀의 PNG 로고를 보냈고, 너비 두 미터의 배너에 필요하다고 해 봅시다. 여기에 PNG를 놓고, 색 세 개로 트레이싱을 고르고, 버튼을 누릅니다. 잠시 뒤 같은 비율의 SVG를 내려받는데, 방패와 글자가 깔끔한 도형입니다. 드로잉 프로그램에서 열어 떠도는 반점 두 개를 지우고 배너 크기로 확대합니다. 가장자리는 선명하게 남습니다. PNG는 폴더에 남습니다.

짧은 점검표

변환하기 전에

그림이 평평한 그림인지 확인하십시오. 잡음을 정리하고 바싹 자르십시오. PNG를 보관하십시오.

변환하는 동안

트레이싱 또는 유지를 고르고 색을 설정하십시오. 파일이 준비될 때까지 페이지에 머무르십시오.

변환한 뒤

SVG를 열고, 확대하고, PNG와 견주어 보고, 드로잉 프로그램에서 다듬으십시오.

흔한 실수

사진을 트레이싱하기

사진은 조각으로 된 포스터가 됩니다. 온 그대로 유지하십시오.

원래의 곡선을 기대하기

트레이싱은 짐작입니다. 원본 SVG가 있다면 그것을 쓰십시오.

색을 너무 많이 쓰기

색이 많으면 도형이 지저분해집니다. 그림에 필요한 만큼만 적게 쓰십시오.

그림은 기기에 남습니다

변환은 로컬에서 이루어집니다. 그림은 브라우저가 읽고, 거기서 트레이싱되어 SVG로 돌아옵니다. 아무것도 업로드되지 않으므로 서버에 사본이 남지 않고 다른 누구도 볼 수 없습니다. 게시 전의 그림이라면 PNG를 SVG로 변환하는 안전한 방법입니다.

요약

여기서 PNG를 SVG로 변환하려면 그림을 놓고, 어떻게 할지 고르고, 버튼을 누르십시오. 고르는 것은 이렇습니다. 그림이 도형이 되거나 온 그대로 남으며, 각 선택의 대가는 시간을 들이기 전에 이 페이지에 적혀 있습니다. 어느 쪽을 고르든 투명도는 유지되고, 트레이싱은 그림의 비율과 자체 픽셀 크기를 SVG의 너비와 높이에 유지합니다. 트레이싱은 짐작이지 복원이 아닙니다. 평평한 색 영역이 어디서 끝나는지 찾아 그 경계를 도형으로 쓰며, 로고, 아이콘, 선화에는 거의 맞고 사진에는 거의 쓸모가 없습니다. 긴 쪽이 1000 픽셀보다 큰 그림은 그 크기로 읽힙니다.