Image Transparency

이미지 투명도는 일부 픽셀을 완전히 또는 부분적으로 비쳐 보이게 하여, 이미지 뒤의 배경이 보이도록 합니다. 투명도 값은 알파 채널에 저장됩니다. 알파 채널은 빨강, 초록, 파랑 값 옆에 있는 픽셀당 추가 값입니다. 8비트 이미지에서 알파 0은 완전 투명, 알파 255는 완전 불투명입니다.

부분 알파 값은 부드러운 가장자리, 그림자, 유리 효과를 표현합니다. 이미지는 알파를 두 방식 중 하나로 저장합니다. 색과 불투명도를 따로 저장하는 방식(straight)과, 색에 이미 불투명도를 곱해 저장하는 방식(premultiplied)입니다. 두 방식을 혼동하면 가장자리에 어두운 테두리나 밝은 테두리가 생깁니다.

일부 형식은 이진 투명도만 지원합니다. 이 방식에서 각 픽셀은 완전히 보이거나 완전히 투명합니다.

이미지 형식 변환

알파 채널을 지원하지 않는 형식으로 변환하면 투명도가 제거됩니다. Image Converter는 PNG, JPG, WebP 사이를 변환합니다. 투명도를 유지하려면 PNG 또는 WebP를 선택합니다.

투명도의 동작 방식

알파가 있는 이미지를 그릴 때, 각 픽셀은 불투명도에 비례하여 뒤에 있는 내용과 혼합됩니다. 부드러운 그림자가 있는 투명 PNG 로고는 흰색, 회색, 사진 위에서 각각 올바르게 섞여 보입니다. 같은 이미지를 병합하면 배경 색이 픽셀에 고정됩니다.

투명도를 지원하는 형식

형식	투명도
PNG	전체 알파, 8비트 또는 16비트
WebP	전체 알파, 손실 또는 무손실
AVIF 및 HEIC	전체 알파
TIFF	전체 알파
GIF	이진, 투명 팔레트 색 하나
JPG	없음
SVG	도형별 불투명도

투명도와 스크린샷

대부분의 스크린샷은 화면의 사각형 영역을 기록하므로 완전 불투명합니다. macOS에서 Shift+Command+4를 누른 뒤 Space를 눌러 창을 캡처하면, 주변이 투명한 창 그림자가 포함될 수 있습니다. 이 결과를 PNG로 저장할 수 있습니다. 이런 이미지를 JPG로 내보내면 투명 영역이 단색으로 채워집니다.

자주 하는 실수

• 투명한 로고를 JPG로 저장함.
• 부드러운 그림자에 GIF를 사용해 가장자리가 계단 모양으로 보임.
• 어두운 배경 위에 투명한 어두운 아이콘을 놓아 아이콘이 보이지 않음.
• 흰색 배경에서만 미리 봄.

지금 고칠 이미지가 있나요?

Social Image Composer로 투명한 이미지를 원하는 배경 위에 배치할 수 있습니다.

자주 묻는 질문

WebP도 투명도를 지원하나요?

네. 손실 모드와 무손실 모드 모두 지원합니다.

투명한 이미지가 검은 배경으로 보이는 이유는 무엇인가요?

이미지를 연 앱이나 변환 도구가 알파를 지원하지 않거나, 이미지를 검은 배경 위에 병합했기 때문입니다.

출처

• Alpha compositing (Wikipedia)
• PNG specification (W3C)

관련 자료

• 이미지 배경 제거: 배경을 투명하게 만드는 방법.
• 내보내기 형식: PNG와 WebP 내보내기.