프로젝트
문의하기

마케팅블랭크 Blog

PNG와 JPG, RGB와 CMYK 차이는? 디자인 파일 저장법 총정리

마케팅블랭크 관리자 | 26.08.11

d9045e84095e9f3e06f2b713e43cb6f5_1786443886_8776.jpg


파일 저장은 ‘어디에 쓸 이미지인가’부터 정하면 훨씬 간단합니다.

웹·SNS용은 보통 RGB로 작업해 JPG 또는 PNG로 내보내고, 명함·리플릿·배너 같은 인쇄물은 CMYK 기준과 인쇄소 규격을 먼저 확인하는 것이 안전합니다.

디자인을 직접 만들다 보면 이미지가 선명한데도 업로드 후 품질이 떨어지거나, 화면에서 본 색과 인쇄 색이 달라 당황하는 일이 생깁니다. 대부분은 파일 형식과 색상 모드를 사용처에 맞게 선택하지 않았을 때 발생합니다.

이번 글에서는 PNG와 JPG의 특징, RGB와 CMYK가 표현하는 방식, 그리고 채널별 디자인 파일 저장법을 실무 기준으로 정리합니다. 처음 작업하는 분도 마지막 체크리스트만 확인하면 목적에 맞는 파일을 고를 수 있습니다.

img_6b0156137aa9dcc861b9409254538651.jpeg

먼저 기억할 핵심: 파일 형식과 색상 모드는 다른 개념입니다

JPG와 PNG는 이미지를 어떤 방식으로 저장할지에 관한 파일 형식입니다. 반면 RGB와 CMYK는 색을 어떤 원리로 표현할지에 관한 색상 모드입니다. 따라서 ‘PNG니까 RGB’처럼 하나로 묶어 생각하기보다, 결과물이 화면용인지 인쇄용인지 판단한 뒤 색상 모드와 저장 형식을 각각 결정해야 합니다.

  • 온라인 화면용: RGB 작업 파일을 JPG, PNG 또는 상황에 따라 WebP로 내보내기
  • 일반 사진: JPG가 용량과 호환성 면에서 무난
  • 투명 배경 로고·아이콘: PNG가 적합
  • 상업 인쇄물: CMYK로 작업하고 인쇄소의 PDF·재단선·프로파일 안내 확인

PNG와 JPG 차이, 가장 쉬운 선택 기준

PNG: 투명 배경과 또렷한 그래픽이 필요할 때

PNG는 일반적으로 손실 없이 압축되는 형식입니다. 저장을 반복해도 이미지 정보 손실이 비교적 적고, 투명도(알파 채널)를 지원한다는 점이 큰 장점입니다. 글자, 선, 도형처럼 경계가 또렷한 디자인 요소를 선명하게 유지하기 좋습니다.

  • 배경이 없는 로고, 심볼, 워터마크
  • 앱·웹사이트 아이콘, 버튼 이미지
  • 텍스트가 많이 들어간 카드뉴스 요소
  • 다른 배경 위에 얹어 사용할 누끼 이미지

다만 사진처럼 색 변화가 복잡한 이미지를 PNG로 저장하면 파일 크기가 커질 수 있습니다. 페이지 로딩 속도나 업로드 제한이 중요한 환경이라면 꼭 필요한 경우에만 PNG를 선택하는 편이 좋습니다.

JPG: 사진을 가볍게 전달하고 싶을 때

JPG(JPEG)는 사람이 인지하기 어려운 일부 정보를 줄여 파일 용량을 낮추는 손실 압축 방식입니다. 풍경, 인물, 제품 사진처럼 색상과 명암이 풍부한 이미지에 효율적입니다. 같은 크기라면 보통 PNG보다 가볍기 때문에 웹페이지와 SNS에서 사진을 빠르게 보여 주는 데 유리합니다.

  • 제품 상세 이미지와 촬영 사진
  • 블로그 본문용 사진
  • 이메일, SNS 피드용 비주얼
  • 용량 제한이 있는 온라인 업로드 이미지

단, JPG는 투명 배경을 보존하지 못합니다. 투명 영역은 흰색 등 하나의 배경색으로 채워집니다. 또한 낮은 품질로 여러 번 저장하면 블록 노이즈나 글자 주변의 번짐이 눈에 띌 수 있으므로, 편집 중에는 원본 또는 작업 파일을 보관하고 최종 단계에서 한 번만 JPG로 내보내기를 권장합니다.

RGB와 CMYK는 왜 결과가 다를까요?

RGB는 빛을 더해 만드는 화면의 색

RGB는 Red, Green, Blue의 약자입니다. 모니터, 스마트폰, 태블릿처럼 빛을 내는 디스플레이는 세 가지 빛을 섞어 색을 표현합니다. 빛을 많이 더할수록 밝아지는 가산혼합 방식이라, 세 색이 모두 최대치에 가까우면 흰색으로 보입니다.

웹사이트, 디지털 광고, 유튜브 썸네일, SNS 콘텐츠처럼 화면에서 소비될 작업은 RGB가 기본입니다. RGB는 화면에서 표현할 수 있는 색 영역이 비교적 넓어 형광색이나 강한 블루·그린 계열이 특히 생생하게 보일 수 있습니다.

CMYK는 잉크를 겹쳐 만드는 인쇄의 색

CMYK는 Cyan, Magenta, Yellow, Key(Black)의 약자입니다. 종이에 잉크를 올리는 인쇄는 빛을 반사해 색을 보여 주므로, 잉크가 쌓일수록 빛을 흡수해 어두워지는 감산혼합 원리로 작동합니다.

전단, 포스터, 브로슈어, 패키지, 명함 등 오프라인 인쇄물을 제작한다면 CMYK가 기본입니다. 다만 모든 인쇄 공정과 용지가 동일하지 않기 때문에, 실제 납품 전에는 인쇄소가 요구하는 색상 프로파일과 파일 규격을 확인해야 합니다.

화면과 인쇄물의 색이 달라지는 이유

모니터는 스스로 빛을 내지만, 종이는 주변 조명을 반사합니다. 여기에 RGB와 CMYK의 색 영역 차이, 모니터 밝기 설정, 종이의 재질과 백색도, 코팅 여부, 인쇄 장비 상태까지 더해지면 같은 숫자값의 색이라도 결과가 달라질 수 있습니다.

특히 화면에서 화려하게 보이는 네온 그린, 형광 핑크, 강한 파랑은 CMYK로 변환할 때 채도가 낮아지거나 탁해질 수 있습니다. 이는 변환 오류가 아니라 표현 가능한 색의 범위가 서로 다르기 때문입니다.

인쇄 색상을 중요하게 관리해야 한다면
RGB 작업물을 마지막 순간에 단순 변환하는 것보다, 처음부터 CMYK 미리보기로 색을 점검하고 필요하면 인쇄 샘플 또는 교정쇄를 확인하는 과정이 안전합니다.

SNS·홈페이지·인쇄물별 디자인 파일 저장법

SNS 카드뉴스와 디지털 광고

인스타그램, 네이버 블로그, 카카오톡 채널, 디스플레이 광고처럼 화면에서 볼 콘텐츠는 RGB로 제작합니다. 사진 중심이라면 JPG, 글자와 도형이 많거나 투명 요소가 있다면 PNG를 우선 검토하세요. 플랫폼이 업로드 과정에서 이미지를 재압축할 수 있으므로, 권장 픽셀 크기에 맞춰 내보내고 지나치게 작은 원본을 확대하지 않는 것이 중요합니다.

홈페이지와 쇼핑몰

웹에서는 품질과 속도를 함께 고려해야 합니다. 상품 사진은 JPG가 일반적이고, 로고·아이콘·투명 배경 그래픽은 PNG가 잘 맞습니다. 최근에는 WebP를 지원하는 웹 환경도 많지만, 업로드 시스템과 브라우저 호환성을 먼저 확인해야 합니다. 어떤 형식을 쓰든 원본 이미지는 별도 보관하고, 웹용 사본만 최적화해 사용하는 방식이 관리에 유리합니다.

명함·전단지·포스터 등 인쇄물

인쇄 작업은 보통 CMYK로 준비합니다. 단, JPG나 PNG만으로 납품하기보다 인쇄소에서 안내하는 PDF 규격을 따르는 경우가 많습니다. 재단되는 인쇄물이라면 사방의 여백인 재단 여유(bleed)를 포함하고, 중요한 문구와 로고는 재단선 안쪽 안전 영역에 배치해야 합니다.

  • 인쇄소가 제공한 완성 사이즈와 재단 여유 확인
  • 폰트는 깨짐 방지를 위해 아웃라인 처리 또는 포함 여부 확인
  • 검정 글자는 작은 글씨일수록 인쇄소 권장 검정값 사용
  • 링크된 이미지의 해상도와 누락 여부 점검
  • 최종 PDF를 열어 오탈자, 여백, 색상 모드 확인

저장 전 30초 체크리스트

  1. 이 파일은 화면용인가, 인쇄용인가?
  2. 배경이 투명해야 하는가?
  3. 사진 위주인가, 텍스트·선·아이콘 위주인가?
  4. 온라인용이라면 RGB로 작업했는가?
  5. 인쇄용이라면 CMYK와 인쇄소 납품 규격을 확인했는가?
  6. 최종 파일 외에 수정 가능한 원본 파일을 보관했는가?

정리하면 사진은 JPG, 투명 배경이 필요한 로고와 그래픽은 PNG, 디지털 콘텐츠는 RGB, 인쇄물은 CMYK라는 기준에서 시작하면 됩니다. 다만 실제 제작 환경에서는 플랫폼과 인쇄소의 세부 가이드가 우선이므로, 납품 또는 게시 직전에 규격을 한 번 더 확인하는 습관이 가장 좋은 디자인 파일 저장법입니다.