투명 PNG: 투명 배경이란 무엇이고 어떻게 만들까

색이 있는 배경 위에 로고를 올렸는데 둘레에 흰 네모가 나타난 적이 있다면, 투명도를 모른 채 이미지를 다루는 사람이 가장 자주 부딪히는 문제를 만난 것입니다. 해법은 단순합니다. 흰 배경 PNG가 아니라 배경이 투명한 PNG가 필요합니다. 이 글에서 그 방법을 하나씩 짚어 보겠습니다.

디지털 이미지에서 투명도란 무엇일까

디지털 이미지는 픽셀로 이루어져 있습니다. 픽셀마다 빨강, 초록, 파랑 세 값(RGB 모델)으로 색이 정해집니다. 예를 들어 순수한 빨강 픽셀은 R=255, G=0, B=0입니다.

여기에 네 번째 값이 붙을 수 있습니다. 바로 알파 채널(alpha channel)입니다. 알파 채널은 픽셀 하나하나의 불투명도를 0(완전히 투명해 보이지 않음)부터 255(완전히 불투명)까지 조절합니다. 알파 값이 0인 픽셀은 화면에 존재하지 않는 것이나 마찬가지여서, 그 자리에는 아래에 깔린 것이 그대로 비칩니다. 슬라이드 배경일 수도, 웹사이트 색일 수도, 티셔츠의 질감일 수도 있습니다.

알파 채널이 있는 이미지를 투명 이미지, 또는 배경이 투명한 이미지라고 부릅니다. 파일 뷰어에서 투명한 픽셀은 회색과 흰색이 번갈아 놓인 체크무늬로 보입니다. 이 체크무늬가 "여기에는 아무것도 없다"를 뜻하는 만국 공통의 표시입니다.

투명도에는 왜 JPG가 아니라 PNG일까

JPG는 알파 채널을 지원하지 않습니다. 형식 자체의 기술적 한계입니다. JPG는 사진을 효율적으로 압축하려고 만들어졌고, 알파 채널은 애초에 규격에 없습니다. 투명 영역이 있는 이미지를 JPG로 저장하면 프로그램이 설정에 따라 그 자리를 흰색이나 검은색으로 채워 버립니다. 배경이 투명한 JPG를 저장할 방법은 없습니다.

반면 PNG는 처음부터 알파 채널을 염두에 두고 설계됐습니다. 로고와 아이콘, 배경이 투명해야 하는 이미지를 PNG로 저장하는 이유가 바로 이것입니다. 차이는 이렇습니다.

투명 PNG가 필요한 순간

투명 배경이 필요한 상황은 꽤 구체적이면서도 자주 되풀이됩니다.

• 색이 있는 배경 위의 로고: 가장 흔한 경우입니다. 흰 배경째로 저장한 로고는 흰색이 아닌 배경 어디에 올려도 흰 사각형이 그대로 드러납니다. 색이 들어간 슬라이드, 헤더가 어두운 웹사이트, 발표 자료 표지, 색 배경의 명함이 모두 여기에 해당합니다.
• 쇼핑몰 제품 사진: 배경이 투명한 제품 컷은 쇼핑몰 배경색이 무엇이든 그 위에 얹을 수 있습니다. 아마존은 흰색, 어떤 오픈마켓은 회색, 시즌 기획전은 캠페인 색으로 바뀌어도 그대로 쓸 수 있습니다.
• 직접 만드는 스티커와 이모티콘: 카카오톡, 텔레그램, 슬랙에 쓰는 스티커는 반드시 투명 PNG여야 합니다. 표준 규격은 배경이 투명한 512×512px PNG입니다.
• 스캔한 서명: 종이에 한 서명을 스캔하고 흰 배경을 지우면 투명 PNG가 됩니다. 종이 사각형이 보이지 않으니 전자 문서나 계약서에 그대로 넣을 수 있습니다.
• 웹사이트용 아이콘과 일러스트: 배경색이 제각각인 여러 섹션에 두루 얹어야 하는 그래픽 요소입니다.
• 영상과 발표 자료 위에 얹는 요소: 프리미어나 캡컷, 다빈치에서 영상 위에 올리는 로고와 워터마크, 그리고 파워포인트나 키노트 슬라이드에 얹는 이미지입니다.

방법 1 — AI 자동 배경 제거(가장 빠름)

로고와 제품 사진, 서명, 아이콘 등 대부분의 경우에는 자동 배경 제거 도구가 손댈 것 없이 몇 초 만에 결과를 내줍니다. ImageTools의 배경 제거 도구는 AI로 이미지의 주요 피사체를 찾아 나머지를 지우고, 알파 채널이 들어간 PNG로 바로 내려줍니다.

1. 배경 제거 도구에 접속합니다.
2. 이미지(JPG, PNG, WebP)를 올립니다. AI가 알아서 처리합니다.
3. 미리보기로 결과를 확인합니다. 체크무늬가 보이는 부분이 투명한 영역입니다.
4. 배경이 투명한 PNG로 내려받습니다. 어디에든 바로 쓸 수 있습니다.

모든 처리는 브라우저 안에서만 이뤄집니다. 이미지가 외부 서버로 전송되지 않습니다.

방법 2 — 알파 채널이 있는 PNG로 변환

배경이 투명한 PNG를 이미 갖고 있는데(예를 들어 디자인 프로그램에서 제대로 내보낸 로고) 다른 형식에서 변환해야 한다면, ImageTools의 변환 도구가 JPG와 WebP를 비롯한 여러 형식을 알파 채널을 살린 채로 PNG로 바꿔 줍니다.

다만 한 가지 짚고 갈 점이 있습니다. JPG를 PNG로 바꾼다고 없던 투명도가 생기지는 않습니다. JPG에는 그 정보 자체가 없기 때문입니다. 변환이 하는 일은 투명도를 지원하는 PNG로 형식을 바꾸는 것뿐이고, 원본 배경이 흰색이었다면 그대로 흰색으로 남습니다. 실제로 투명하게 만들려면 방법 1(배경 제거)이나 방법 3(직접 편집)을 쓰십시오.

방법 3 — 포토샵이나 김프에서 직접 편집

배경이 균일하지 않거나 그러데이션이 섞여 있는 이미지, 또는 무엇을 남기고 무엇을 지울지 세밀하게 정해야 하는 경우라면 이미지 편집 프로그램에서 직접 작업하는 편이 낫습니다.

포토샵에서

1. 포토샵에서 이미지를 엽니다.
2. 배경 레이어가 "잠김" 상태(레이어에 자물쇠 아이콘)라면 레이어를 더블 클릭하고 확인을 눌러 잠금을 풉니다.
3. 배경이 단색이라면 선택 → 색상 범위에서 배경을 클릭하고 허용치를 조절한 뒤 선택 영역을 삭제합니다.
4. 더 정밀하게 따내야 한다면 자석 올가미나 빠른 선택 도구로 피사체를 선택하고, 선택 영역을 반전(Shift+Ctrl+I)한 뒤 삭제합니다.
5. 파일 → 내보내기 → 다른 이름으로 내보내기에서 PNG를 고르고, 투명도 옵션이 켜져 있는지 확인합니다.

김프에서(무료)

1. 김프에서 이미지를 엽니다.
2. 이미지 → 이미지 평탄화를 실행한 뒤 이미지 → 모드 → RGB로 바꿉니다.
3. 알파 채널을 추가합니다. 이미지 → 이미지 평탄화가 아니라 레이어 → 투명도 → 알파 채널 추가입니다.
4. 도구 → 선택 도구 → 색상 선택으로 배경을 선택합니다.
5. Delete 키로 선택 영역을 지웁니다. 배경이 투명해지면서 체크무늬가 나타납니다.
6. 파일 → 다른 이름으로 내보내기에서 PNG를 고르고 옵션을 확인한 뒤 내보냅니다.

PNG가 정말 투명한지 확인하는 방법

모든 PNG가 투명한 것은 아닙니다. 흰 배경째로 저장해도 여전히 "PNG"입니다. 확인하는 방법은 배경을 보는 것입니다. 회색과 흰색 체크무늬가 보이면 투명도가 있는 것이고, 흰색으로 꽉 차 있으면 불투명한 배경입니다.

이런 방법으로도 확인할 수 있습니다.

• 윈도우 11: 기본 사진 뷰어로 파일을 엽니다. 체크무늬가 보이면 투명입니다.
• 맥(미리보기): 파일을 엽니다. 미리보기에 체크무늬가 보이면 투명입니다.
• 브라우저: 크롬이나 파이어폭스에서 PNG를 바로 엽니다. 체크무늬면 투명, 흰색으로 꽉 차 있으면 불투명입니다.
• 캔바나 구글 슬라이드: 배경에 색이 있는 슬라이드에 PNG를 넣어 봅니다. 이미지 배경이 "사라지고" 주요 내용만 보이면 투명입니다.

투명 PNG를 상황별로 쓰는 법

웹사이트에서(HTML/CSS)

투명 PNG는 <img> 태그에 그대로 넣으면 됩니다. 투명한 배경은 페이지나 상위 요소의 배경에 알아서 맞춰집니다.

<!-- 로고가 사이트의 어떤 배경에도 맞춰집니다 -->
<img src="logo.png" alt="회사 로고" width="200" height="80">

Word와 구글 문서에서

평소처럼 이미지를 삽입하면 됩니다. Word와 구글 문서는 PNG의 투명도를 알아서 인식하므로, 로고가 흰 사각형 없이 본문이나 문서 배경 위에 그대로 얹힙니다.

파워포인트와 구글 슬라이드에서

삽입 → 그림으로 넣으면 됩니다. 투명도는 그대로 유지되어, 투명한 영역 너머로 슬라이드의 색과 디자인이 비치고 PNG만 그 위에 "떠 있는" 것처럼 보입니다.

메신저 스티커로

메신저 스티커를 만들려면 파일이 512×512px 크기의 투명 PNG여야 합니다. 이미지를 만든 뒤 배경 제거로 배경을 지우고, 크기 조절로 512×512px에 맞춘 다음 스티커 제작 앱으로 불러오면 됩니다.

영상에서(캡컷, 프리미어, 다빈치)

영상 편집 프로그램은 PNG의 알파 채널을 인식해, 투명한 영역으로 아래 레이어가 비치도록 보여 줍니다. 불투명한 배경 없이 영상에 로고 워터마크를 얹을 때 제격입니다.

부분 투명도와 반투명

PNG의 알파 채널은 완전 투명(알파 0)과 완전 불투명(알파 255)만 다루는 것이 아니라 그 사이 256단계를 모두 표현합니다. 덕분에 다음과 같은 효과가 가능합니다.

• 부드러운 그림자: 물체의 그림자에 부분 투명도를 줄 수 있습니다. 물체에서 멀어질수록 더 투명해지면서 자연스러운 그러데이션이 생깁니다.
• 안티앨리어싱된 가장자리: 둥근 아이콘이나 곡선이 있는 글자의 가장자리에는 반투명 픽셀이 깔려서, 어떤 배경 위에서도 매끄럽게 보입니다.
• 유리와 안개 같은 효과: macOS와 윈도우의 요즘 인터페이스에서 흔히 보이는, 부분적으로 투명한 UI 요소입니다.

이 반투명 정보는 알파 채널이 있는 PNG로 제대로 저장하면 그대로 보존됩니다. 모서리가 둥근 로고가 PNG에서는 어떤 배경 위에서도 깔끔한데 JPG로 저장하면 가장자리가 지저분해지거나 흰 테두리가 생기는 이유가 바로 여기에 있습니다.

투명 PNG에서 흔히 하는 실수

투명하게 만든 뒤 JPG로 저장하기

가장 자주 나오는 실수입니다. 배경을 지운 결과를 JPG로 저장하면 투명도가 사라집니다. JPG는 투명한 영역을 전부 흰색으로 채우기 때문입니다. 알파 채널을 지키려면 최종 파일은 반드시 PNG(또는 WebP)로 저장해야 합니다.

알파 채널이 사라지는 방식으로 압축하기

일부 압축 도구는 용량을 더 줄이려고 PNG를 JPG로 자동 변환합니다. 압축이 제대로 됐는지 항상 확인하십시오. 결과 파일이 JPG라면 투명도는 이미 사라진 것입니다.

흰 배경과 투명 배경을 헷갈리기

흰 배경 PNG와 투명 배경 PNG는 흰 바탕 위에서는 똑같아 보입니다. 문제는 다른 배경에 올리는 순간 드러납니다. 쓰기 전에 색이 있는 배경 위에 올려 투명한지 꼭 확인하십시오.

투명도를 지원하지 않는 곳에 투명 PNG 올리기

모든 곳이 투명도를 받아 주거나 유지해 주지는 않습니다. 구형 클라이언트의 HTML 이메일, 일부 프린터, 오래된 플랫폼의 특정 업로드 항목은 투명 배경을 검은색이나 흰색으로 바꿔 버립니다. 이런 곳에는 목적지에 맞는 불투명 배경 버전을 따로 내보내십시오.

자주 묻는 질문