배경 제거와 크로마키 완전정복

배경 제거·치환 도구는 스프라이트·아이콘·로고처럼 배경이 단순한 이미지에서 그 배경만 골라 투명하게 지우거나 지정한 색으로 덮는 도구입니다. 사람이 마스크를 그리는 것이 아니라 색을 기준으로 가르기 때문에, 어떤 색을 배경으로 보았는지와 그 색에서 얼마나 벗어난 픽셀까지 배경으로 칠지가 결과를 전부 결정합니다. 이 문서는 그 두 가지 — 자동 판정과 허용치 — 가 실제로 어떤 계산으로 동작하고 언제 빗나가는지를 구현 기준으로 정리합니다. 모든 처리는 브라우저 안에서 끝나므로 올린 이미지가 서버로 전송되지 않습니다.

배경은 어떻게 자동으로 찾는가

판정은 이미지 전체가 아니라 네 변의 테두리를 봅니다. 스프라이트 시트에서 네 변이 모두 캐릭터로 가득 찬 경우는 드물고, 테두리는 거의 언제나 배경이기 때문입니다. 판정기는 먼저 알파 채널을 확인해 이미 투명한 영역이 충분히 넓으면 투명 배경으로 결론짓고 색 비교를 아예 하지 않습니다 — 이미 누끼가 따인 PNG를 다시 색으로 가르면 오히려 망가지기 때문입니다. 투명이 아니면 테두리에서 픽셀을 표본으로 모아 중앙값 색을 구하고, 표본들이 그 중앙값에서 평균적으로 얼마나 떨어져 있는지를 함께 잽니다. 흩어짐이 작으면 단색 배경, 테두리가 두세 가지 색으로 또렷하게 나뉘면 팔레트 배경으로 보고 그 색들을 모두 배경 후보로 둡니다.

어느 쪽으로도 모이지 않으면 판정기는 억지로 색 하나를 고르지 않고 판정 실패를 선언합니다. 화면에는 배경을 자동으로 찾지 못했다는 안내가 뜨고, 그 장은 배경이 확정되지 않은 상태이므로 내보내기 대상에서도 빠집니다. 틀린 색으로 조용히 지워 캐릭터에 구멍을 내는 것보다 아무것도 하지 않고 사람에게 묻는 편이 낫다는 판단입니다. 평균값이 아니라 중앙값을 쓰는 것도 같은 이유입니다 — 테두리에 걸친 캐릭터 픽셀 몇 개가 평균을 끌고 가면 배경도 전경도 아닌 엉뚱한 색이 기준이 됩니다.

자동 판정이 빗나가는 순간과 스포이트

자동 판정이 가장 자주 실패하는 조건은 하나로 요약됩니다 — 배경색이 스프라이트 안에도 쓰인 경우입니다. 흰 배경 위의 흰 눈동자, 검은 배경 위의 검은 외곽선, 파란 크로마키 위의 파란 망토가 모두 여기에 해당합니다. 이때 테두리 표본만 보는 판정기는 배경색을 정확히 맞히지만, 그 색을 기준으로 픽셀을 가르는 순간 스프라이트 안쪽의 같은 색까지 함께 배경으로 분류되어 캐릭터에 구멍이 뚫립니다. 판정이 틀린 것이 아니라 색만으로는 구분할 수 없는 입력인 셈입니다. 반대로 그라데이션 배경이나 사진 배경은 테두리 표본 자체가 흩어져 판정 실패로 떨어집니다.

스포이트는 이 두 상황 모두에 쓰는 정정 수단입니다. 왼쪽 원본 미리보기를 클릭하면 그 지점의 픽셀 색이 곧바로 배경색으로 확정되고, 자동 판정 결과는 무시됩니다. 미리보기는 판정에 쓴 바로 그 픽셀을 보간 없이 그린 것이라, 화면에서 집은 색과 엔진이 비교하는 색이 정확히 같습니다. 판정 실패였던 장도 이 한 번의 클릭으로 배경이 확정되어 내보낼 수 있게 됩니다. 사람이 찍을 수 있는 것은 한 점의 색뿐이므로 스포이트로 지정한 배경은 언제나 단색이며, 여러 장을 올렸다면 모든 장에 적용으로 같은 보정을 배치 전체에 퍼뜨리고, 자동 판정으로 되돌리기로 언제든 원래 판정으로 돌아갈 수 있습니다.

허용치 — 올리면 뚫리고 내리면 남는다

배경색을 정했다고 해서 그 색과 정확히 일치하는 픽셀만 지우면 실제 이미지에서는 거의 아무것도 지워지지 않습니다. JPEG 압축 잡티, 스캔 노이즈, 미묘한 그라데이션 때문에 배경은 언제나 조금씩 다른 색들의 집합이기 때문입니다. 그래서 배경색과 각 픽셀 사이의 거리를 재고, 그 거리가 허용치 이하면 배경으로 봅니다. 거리는 R·G·B 세 채널의 차이를 제곱해 더한 뒤 제곱근을 취한 값 — 평범한 유클리드 거리입니다. 허용치는 0부터 64까지의 정수이고 기본값은 24입니다.

이 값은 한쪽으로 치우칠 수 없는 저울입니다. 올리면 배경의 잡티까지 넉넉히 지워지지만, 반경이 넓어진 만큼 배경색과 가까운 스프라이트 색이 함께 잡혀 캐릭터가 뚫립니다 — 흰 배경에서 허용치를 크게 올리면 밝은 회색 하이라이트가 먼저 사라지는 식입니다. 내리면 스프라이트는 안전하지만 배경이 얼룩덜룩하게 남고, 그 잔여 픽셀은 나중에 이미지 슬라이서로 프레임을 자를 때 프레임 경계를 부풀리는 원인이 됩니다. 정답은 이미지마다 다르므로 슬라이더를 움직이며 오른쪽 결과 미리보기에서 구멍이 생기기 직전 값을 찾는 것이 가장 확실합니다. 결과 미리보기는 체커보드 위에 그려지므로 투명해진 영역이 눈에 바로 보입니다.

1px 경계가 남는 이유

배경으로 판정된 픽셀이라도 이웃 여덟 칸 중 하나라도 전경이면 그 픽셀은 건드리지 않고 그대로 둡니다. 그래서 스프라이트 윤곽을 따라 배경색이 한 겹 남습니다. 이것은 덜 지운 것이 아니라 일부러 남긴 것입니다 — 안티앨리어싱으로 그려진 이미지의 가장자리 픽셀은 캐릭터 색과 배경색이 섞인 중간색이라, 색만 보면 배경 쪽에 가깝지만 실제로는 윤곽선의 일부입니다. 그 띠까지 지우면 곡선과 사선이 계단처럼 갈라지고, 확대했을 때 테두리가 한 겹 갉아먹힌 것이 그대로 보입니다.

남은 띠가 문제가 되는 상황은 두 가지입니다. 하나는 결과를 다른 색 배경 위에 얹을 때로, 옛 배경색이 옅은 후광처럼 비칩니다 — 이때는 제거 대신 치환을 골라 그 띠를 새 배경색으로 덮는 편이 깔끔합니다. 다른 하나는 픽셀아트처럼 안티앨리어싱이 애초에 없어야 하는 원본인데, 이 경우 남는 띠는 원본에 이미 섞여 있던 중간색이므로 원본을 안티앨리어싱 없이 다시 내보내는 것이 근본 해결입니다.

제거와 치환은 픽셀에 무엇을 하는가

제거는 배경 픽셀의 알파만 0으로 내리고 R·G·B 값은 그대로 둡니다. 색까지 지우지 않는 이유는 두 가지입니다 — 지운 자리의 원래 색이 남아 있어야 나중에 되돌릴 여지가 있고, 알파 0인 픽셀의 색이 검정으로 채워져 있으면 인코더나 리샘플러가 그 검정을 가장자리로 번지게 해 결과에 어두운 테두리가 생기기 때문입니다. 치환은 반대로 배경 픽셀의 R·G·B를 지정한 색으로 바꾸고 알파를 완전 불투명으로 세웁니다. 원래 요청이 그랬듯, 흰색이나 투명처럼 흔한 배경을 원본에 없는 색(예: 선명한 마젠타)으로 갈아 두면 그 다음 단계의 누끼 작업이 훨씬 쉬워집니다.

치환 색을 배경색과 거의 같은 값으로 고르면 화면에 무이득 안내가 뜹니다. 지워질 픽셀이 사실상 같은 색으로 다시 칠해질 뿐이라 결과가 원본과 다르지 않기 때문입니다. 판정 기준과 같은 반경을 쓰므로, 안내가 떴다면 허용치를 줄이거나 치환 색을 배경에서 더 멀리 떨어뜨려야 합니다.

사용 순서

이미지를 한 장 또는 여러 장 올립니다. 올리는 즉시 장마다 배경 자동 판정이 돌아갑니다.
목록에서 장을 고르고 배경 표시를 확인합니다 — 투명·단색·팔레트·직접 지정 중 무엇으로 보고 있는지와 그 색 견본이 함께 나옵니다.
판정이 틀렸거나 실패했다면 왼쪽 원본 미리보기에서 배경이 확실한 지점을 클릭해 색을 직접 지정합니다.
허용치 슬라이더를 움직이며 오른쪽 결과 미리보기를 봅니다. 캐릭터에 구멍이 생기기 직전이 적정값입니다.
제거와 치환 중 동작을 고릅니다. 치환이면 바꿀 색을 함께 지정합니다.
여러 장이라면 모든 장에 적용으로 지금 장의 보정을 나머지 장에 퍼뜨립니다.
내려받거나, 이어서 프레임을 잘라야 한다면 이미지 슬라이서로 바로 넘깁니다 — 다시 업로드할 필요가 없습니다.

실패와 주의

배경색이 스프라이트 안에도 쓰인 이미지는 색만으로 가를 수 없습니다. 허용치를 낮춰도 같은 색 픽셀은 끝까지 함께 지워지므로, 이런 원본은 배경색 자체를 바꿔서 다시 뽑는 편이 빠릅니다.
판정에 실패한 장은 배경이 확정될 때까지 내보내기 대상에서 빠집니다. 원본이 그대로 결과 이름을 달고 나가 처리된 것으로 오인되는 일을 막기 위한 규칙입니다.
한 장이 실패해도 나머지 장은 계속 진행됩니다. 실패 사유는 그 장 아래에만 표시되며, 흔한 원인은 디코딩 불가 파일이거나 픽셀 수가 6,400만을 넘는 초대형 이미지입니다.
결과는 언제나 PNG입니다. 투명을 담아야 하므로 JPEG를 올려도 PNG로 나오고, 이름 뒤에는 제거는 -nobg, 치환은 -key가 붙습니다. 두 장 이상이면 ZIP 하나로 묶입니다.
미리보기는 실제 크기가 아니라 축소된 화면입니다. 경계 한 픽셀을 확인해야 한다면 내려받은 결과를 원본 크기로 열어 보세요.
팔레트 배경으로 판정된 장에서 스포이트를 쓰면 배경은 단색으로 바뀝니다. 색이 둘 이상인 배경이라면 자동 판정을 그대로 두는 편이 나은 경우가 많습니다.

자주 묻는 질문

Q. 배경을 자동으로 못 찾았다는 안내가 떴습니다.
테두리에서 뽑은 표본 색이 한 가지로 모이지 않았다는 뜻입니다. 판정기는 이미지 네 변에서 픽셀을 표본으로 모아 중앙값 색을 구하고, 표본이 그 중앙값에서 얼마나 흩어져 있는지를 함께 잽니다. 흩어짐이 기준치를 넘으면 어떤 색을 배경이라고 단정하지 않고 판정을 포기합니다 — 그라데이션 배경, 사진 배경, 테두리에 이미 캐릭터가 걸쳐 있는 시트가 대표적입니다. 이때는 원본 미리보기에서 배경이 확실한 지점을 클릭하면 그 픽셀의 색이 배경색으로 확정되고, 판정 실패 안내가 사라지면서 결과 미리보기가 다시 계산됩니다.

Q. 허용치는 몇으로 두는 게 좋나요?
기본값 24에서 시작해 결과 미리보기를 보며 움직이는 것이 가장 빠릅니다. 허용치는 0부터 64까지의 정수이고, 배경색과 각 픽셀 사이의 R·G·B 세 채널 유클리드 거리와 비교됩니다 — 거리가 허용치 이하인 픽셀만 배경으로 봅니다. JPEG로 저장돼 배경에 잡티가 낀 이미지는 30 근처까지 올려야 얼룩이 사라지고, 배경색과 비슷한 색의 스프라이트가 들어 있는 이미지는 12~16까지 내려야 캐릭터가 뚫리지 않습니다. 정답이 하나가 아니라 이미지마다 다르므로, 슬라이더를 움직이며 오른쪽 결과 미리보기에서 구멍이 생기는 순간을 찾는 편이 확실합니다.

Q. 경계에 배경색이 1픽셀 남았습니다. 버그인가요?
의도된 동작입니다. 안티앨리어싱된 스프라이트의 가장자리 픽셀은 캐릭터 색과 배경색이 섞인 중간색이라, 그 픽셀까지 지우면 윤곽이 한 겹 깎여 계단처럼 보이고 확대하면 테두리가 갉아먹힌 티가 납니다. 그래서 배경으로 판정된 픽셀이라도 이웃 여덟 칸 중 하나라도 전경이면 건드리지 않고 남깁니다. 남은 1픽셀이 거슬린다면 제거 대신 치환을 골라 그 띠를 원하는 색으로 덮거나, 원본을 안티앨리어싱 없이 다시 뽑는 편이 낫습니다.

Q. 여러 장을 올렸는데 한 장만 실패했습니다.
실패한 장만 목록에서 처리 실패로 표시되고 나머지 장은 그대로 진행됩니다. 실패 사유는 그 장 아래에 따로 표시되며, 흔한 원인은 브라우저가 디코딩하지 못하는 파일이거나 픽셀 수가 6,400만(예: 8000×8000)을 넘어 예산에 걸린 경우입니다. 실패한 장은 선택할 수 없고 내보내기 대상에서도 빠지므로, 원본이 그대로 결과 파일 이름을 달고 나가는 일은 없습니다.

Q. 결과 파일은 어떤 형식으로 나오나요?
항상 PNG입니다. 제거 결과는 알파 채널이 있어야 투명이 유지되므로 JPEG를 올렸더라도 PNG로 나옵니다. 파일 이름은 원본 이름 뒤에 동작을 붙여 제거는 -nobg, 치환은 -key가 됩니다. 결과가 한 장이면 PNG가 그대로 내려오고 두 장 이상이면 remove-bg.zip 하나로 묶이며, ZIP 안에서 이름이 겹치면 서로 덮어쓰지 않도록 미리 유일하게 만듭니다.