24비트 RGB 색상 컬러코드 JPG와 PNG의 차이는 투명도 Alpha

이미지 파일의 배경 제거, 투명하게 편집

하는 프로젝트를 마무리하려 했는데..

단순히 이번 네이비 색 배경을 제거하는 것에

그치지 않고 좀 더 범용적인 코드로 만들고자

컬러 코드에 대해 조금 더 개념을 명확히

할 필요성을 느꼈습니다. 기초부터 탄탄히!

 

파이썬으로 이미지 배경제거를 위한 픽셀 값 좌표 및 컬러코드 실시간 추출

 

이전 시간에 pyautogui 모듈을 사용해서

마우스 커서 위치의 좌표와 컬러코드를

실시간으로 추출하는 코드를 짜봤습니다.

네이비 배경의 컬러 코드를 가만 보아하니

(3#, 3#, 6#) 즈음으로 확인이 됐습니다.

이게 뭘까요?? RGB 색상 값입니다.

좀 더 알아봅시다.

 

 

여러 소프트웨어에서 많이 보셨을

다양한 형태의 컬러코드 표입니다.

Color Code Table / Color chart

🗺️

횡으로 보면 R G B 다시 R로 돌아오고

양 극은 White & Black 마치 세계지도 같네요ㅋㅋ

 

RGB는 #000000(검정)부터 #FFFFFF(흰색)까지

16진수의 2자리 숫자씩 R, G, B에 할당되어

intensity를 나타내고 16^2=256개로 세분화됩니다.

#FF0000 - 빨강 (#FFFF00 - 노랑)

#00FF00 - 초록 (#00FFFF - 하늘)

#0000FF - 파랑 (#FF00FF - 분홍)

위 그림이랑 매칭해보면 대충 아시겠죠?

 

** 16진수 : 0~9, A~F (cnt: 16)

 

그림판의 저장옵션

 

위 표기를 파이썬에선 튜플로 만들어

블랙(0,0,0)부터 흰색(255,255,255)까지

각 색상은 256개로 세분화해 표시합니다.

256은 2^8으로 8비트, RGB 3개의 채널이니

총 24비트(256^3가지 색상이 표현되죠.)

True Color라고도 합니다. JPG가 24비트 지원

8비트(bit) = 1바이트(byte) = 2^8 = 256

 

 

한가지 더 재밌는 사실은 여기에 '투명도'

 opacity, transparency를 Alpha라 정의해서

RGBA 4개의 채널로 8비트가 4개, 32비트를

쓰기도 하는데 PNG가 이를 지원합니다.

가끔 이미지 배경이 격자모양으로 투명인게 있죠?

PNG로 저장해야 투명도가 유지되겠네요.

 

항목	JPG (JPEG)	PNG
비트 깊이	24비트(RGB) 또는 8비트 (Grayscale)	24비트(RGB), 32비트(RGBA), 8비트(팔레트)
투명도(Alpha)	없음	지원 (RGBA)
압축 방식	손실 압축 (Lossy)	무손실 압축 (Lossless)
파일 크기	작음 (압축률 높음)	큼 (무손실 압축)
화질	압축 시 화질 손실 발생	화질 유지
색상 표현	약 1,677만 색 (24비트)	약 1,677만 색 (24비트) + 투명도
사용 예시	사진, 웹 이미지 (빠른 로딩)	로고, 아이콘, 투명한 이미지

 

JPG는 투명도 깨지는데 화질이 손실될 수 있다니,,

앞으로는 PNG를 애용해야겠네요.. 

 

추가로 정리하자면,,

단색은 1비트, 16색은 4비트(2^4), 256색이 8비트

앞서 언급한 RGB True color가 24비트

얼마나 세분화해서 색상을 지원하는지

화질 순이라고 보시면 되겠습니다.