로고 크기: 웹사이트·SNS·인쇄용 규격 가이드

제대로 된 로고는 성격이 전혀 다른 여러 자리에서 모두 제 역할을 해야 합니다. 브라우저 탭에서는 파비콘으로 작게, 사이트 헤더에서는 중간 크기로, 간판 현수막에서는 크게, 인스타그램 프로필에서는 정사각형으로, 명함에서는 가로로 놓입니다. 자리마다 필요한 크기와 형식이 다르고, 크기를 잘못 쓰면 로고가 흐려지거나 잘리거나 비율이 일그러집니다.

다행인 것은 쓰임마다 처음부터 새로 만들 필요가 없다는 점입니다. 알맞은 형식의 원본 파일 하나만 있으면 ImageTools의 이미지 크기 조절 도구가 어떤 용도의 크기든 몇 초 만에 맞춰 줍니다.

로고는 어떤 형식으로 갖춰 두어야 할까

구체적인 크기를 이야기하기 전에, 어떤 형식의 파일을 갖고 있어야 하는지부터 짚어 보겠습니다. 잘 정리된 로고라면 적어도 다음 버전들은 있어야 합니다.

SVG(벡터): 원본 파일입니다. 16px 파비콘부터 10미터 옥외 광고판까지 어떤 크기로 키워도 화질이 떨어지지 않습니다. 웹사이트, 발표 자료, 인쇄소 입고에 반드시 필요합니다.
투명 배경 PNG(고해상도): SVG를 받지 않는 디지털 환경에서 씁니다. 나중에 크기를 자유롭게 줄일 수 있도록 최소 1000×1000px로 저장하세요.
흰 배경 PNG: 투명 배경이 필요 없거나 지원되지 않는 곳에 씁니다. 각종 플랫폼 가입 양식, 워드 문서, 이메일이 여기에 해당합니다.
어두운 배경용 PNG 또는 JPG(흰색 요소): 색이 있거나 어두운 배경 위에 올릴 때 씁니다. 짙은 파란색 로고는 검은 배경에서 완전히 사라집니다.
파비콘(.ico + PNG): 브라우저 탭 전용 버전입니다. ImageTools의 파비콘 만들기 도구에 로고를 넣으면 필요한 크기가 한 번에 만들어집니다.

☁️ 클라우드에 모아 두세요. 이 버전들을 구글 드라이브나 드롭박스에 두고 언제든 꺼낼 수 있게 해 두세요. 프리랜서 디자이너에게 일을 맡길 때, SNS 프로필을 바꿀 때, 인쇄소에 파일을 넘길 때 필요해지는데, 대개 급할 때 필요해집니다.

기준표 — 상황별 로고 크기

상황	권장 크기	권장 형식	비고
사이트 헤더(데스크톱)	가로 200~400px	SVG 또는 투명 PNG	세로는 레이아웃에 맞춰 비례
파비콘(브라우저 탭)	16×16, 32×32, 48×48px	.ico + PNG	파비콘 만들기 도구 활용
애플 터치 아이콘(iOS)	180×180px	투명도 없는 PNG	단색 배경 권장
안드로이드 앱 아이콘(PWA)	192×192 e 512×512px	PNG	웹 매니페스트 필수 항목
인스타그램 — 프로필 사진	320×320px(110px로 표시)	PNG 또는 JPG	원형으로 잘려 표시됨
페이스북 — 프로필 사진	170×170px	PNG 또는 JPG	데스크톱에서 원형으로 표시
페이스북 — 커버 사진	820×312px	JPG 또는 PNG	로고는 요소로만, 전체를 채우지 않음
링크드인 — 회사 로고	300×300px	PNG 또는 JPG	최소 300×300, 최대 4MB
링크드인 — 회사 커버	1128×191px	PNG 또는 JPG	커버 안의 요소로 배치
유튜브 — 채널 아이콘	800×800px	PNG 또는 JPG	원형 표시, TV에서는 98px
유튜브 — 채널 아트	2560×1440px	JPG 또는 PNG	로고는 요소로, 안전 영역 1546×423px
왓츠앱 비즈니스 — 프로필	640×640px	PNG 또는 JPG	원형으로 표시
틱톡 — 프로필 사진	200×200px(최소)	JPG 또는 PNG	원형으로 표시
트위터 / X — 프로필 사진	400×400px	PNG 또는 JPG	원형 표시, 피드에서는 48px
이메일 서명	가로 200~300px	흰 배경 PNG 또는 JPG	구형 메일 앱에서는 투명 배경 피하기
명함(디지털 파일)	가로 400~600px	투명 PNG	명함 레이아웃에 배치할 용도
발표 자료(슬라이드)	가로 200~400px	투명 PNG 또는 SVG	슬라이드 비율(16:9)에 맞춤

웹사이트용 로고

헤더

사이트 헤더의 로고는 보통 가로 150~400px이고, 세로는 그에 비례합니다. 정확한 폭은 레이아웃에 달렸습니다. 조밀한 헤더라면 150px으로 충분하고, 여유가 있는 사이트라면 300~400px까지 쓸 수 있습니다. 가장 중요한 것은 레티나 화면에서의 선명함입니다. PNG라면 표시 폭의 두 배로 내보내고(SVG를 쓰면 이 문제는 저절로 해결됩니다), 실제 표시 크기는 CSS에 맡기세요.

헤더에는 반드시 SVG나 투명 배경 PNG를 쓰세요. 헤더 배경은 디자인이나 스크롤에 따라 바뀌는데, 흰 배경이 붙은 로고는 색이 있는 배경 위에서 흰 사각형으로 드러납니다.

Favicon

파비콘은 브라우저 탭과 즐겨찾기, 모바일 홈 화면에 표시되는 아이콘입니다. 잘 만든 파비콘은 로고를 단순하게 줄인 형태로, 보통 심볼이나 이니셜만 씁니다. 회사 이름을 다 넣기에는 공간이 너무 좁아 글자가 읽히지 않기 때문입니다.

필요한 크기는 데스크톱 브라우저용 16×16px과 32×32px, iOS용 180×180px(애플 터치 아이콘), 안드로이드와 PWA용 192×192px과 512×512px입니다. ImageTools의 파비콘 만들기 도구에 로고를 넣으면 이 크기들이 자동으로 한꺼번에 만들어집니다.

파비콘에 필요한 크기를 한 번에 만들기

로고 하나로 브라우저, iOS, 안드로이드, PWA용 파비콘까지. 필요한 크기가 몇 초 만에 나옵니다.

무료로 파비콘 만들기

SNS용 로고

로고가 정사각형과 원형에서 모두 통해야 하는 이유

거의 모든 SNS가 프로필 사진을 원형으로 보여 줍니다. 이름과 아이콘이 나란히 놓인 가로형 로고에는 까다로운 조건입니다. 원 안에서는 로고가 읽기 어려울 만큼 작아지거나, 가장자리가 잘려 나가기 때문입니다.

가장 확실한 해법은 심볼이나 브랜드 이니셜만 정사각형 가운데에 놓은 "아이콘 버전"을 SNS 프로필 전용으로 따로 갖추는 것입니다. 잘림 문제 없이 브랜드를 알아보게 하는 방법입니다.

Instagram

인스타그램은 최대 320×320px 프로필 사진을 받지만, 실제로는 프로필에서 110px, 피드에서 32px로 보여 줍니다. 파일은 정사각형이어야 합니다. 가로형 로고라면 정사각형 안에 가운데로 놓고 여백을 충분히 주어, 원형으로 잘릴 때 아무것도 잘려 나가지 않게 하세요.

Facebook

페이스북 페이지의 프로필 사진은 데스크톱에서 170×170px, 모바일에서 128×128px로 표시되며 언제나 원형으로 잘립니다. 커버 사진은 820×312px인데, 여기서는 로고가 커버 디자인의 한 요소로 들어갈 뿐 화면 전체를 채우지는 않습니다.

링크드인은 회사 페이지에서 로고를 300×300px 정사각형으로 보여 주고, 목록에서는 더 작게 표시합니다. 이미지 품질이 전문성에 대한 인상을 가장 크게 좌우하는 자리이므로, 과하게 압축하지 않은 고품질 PNG를 쓰세요.

YouTube

유튜브 채널 아이콘은 보는 자리에 따라 크기가 크게 달라집니다. 스마트 TV에서는 98px, 데스크톱 피드에서는 32px, 모바일 프로필에서는 88px입니다. 이 모든 크기에서 선명하려면 파일이 최소 800×800px이어야 합니다. 채널 아트(배너)는 2560×1440px이지만, 모든 기기에서 보이는 "안전 영역"은 가운데 1546×423px뿐입니다. 로고는 이 안에 들어가야 합니다.

왓츠앱 비즈니스

왓츠앱 비즈니스의 프로필 사진은 원형으로 표시되며, 대화 목록에서는 50px 정도로 보입니다. 전체 화면 미리보기에서도 선명하도록 640×640px 파일을 쓰세요. 다른 SNS와 마찬가지로 가로형 로고는 여기서도 잘 맞지 않으니, 아이콘이나 심볼 버전을 쓰는 편이 좋습니다.

📐 SNS에 가로형 로고를 쓸 때의 팁: 좌우에 흰 여백(또는 브랜드 배경색)을 붙여 정사각형 버전을 만드세요. 로고가 정사각형 가로의 60~75%를 차지하고 사방 여백이 같을 때 가장 보기 좋습니다. 이렇게 하면 원형으로 잘려도 로고가 온전히 보입니다.

인쇄용 로고

인쇄는 디지털과 완전히 다른 셈법을 씁니다. 중요한 것은 픽셀 수 자체가 아니라, 픽셀과 실제 인쇄 크기 사이의 관계이며 이를 DPI(1인치당 점의 수)로 나타냅니다. 인쇄 업계의 표준은 300DPI입니다.

인쇄에 필요한 픽셀 계산법

공식: 픽셀 = 크기(cm) ÷ 2.54 × DPI

실제 예시:

인쇄물	로고의 일반적인 크기	필요한 픽셀(300DPI)
명함(로고)	3 × 1,5 cm	354 × 177px
레터헤드(상단)	5 × 2 cm	591 × 236px
소형 패키지	4 × 4 cm	472 × 472px
티셔츠(가슴)	10 × 5 cm	1181 × 591px
머그컵(측면 로고)	8 × 4 cm	945 × 472px
주문 제작 쇼핑백	15 × 8 cm	1772 × 945px
배너·롤업(상단 로고)	20 × 10 cm	2362 × 1181px

매번 계산하지 않으려면 SVG를 쓰는 것이 가장 편합니다. 벡터 형식이라 제한 없이 확대되고, 어떤 크기로 인쇄해도 품질이 떨어지지 않습니다. 전문 인쇄소라면 어디든 SVG를 받으며, 일러스트레이터나 잉크스케이프에서 SVG로 만든 벡터 PDF도 마찬가지입니다.

인쇄소가 받는 파일 형식

대부분의 전문 인쇄소는 다음 형식을 받고, 또 선호합니다.

벡터 PDF: 업계 표준입니다. 벡터 로고를 일러스트레이터, 코렐, 잉크스케이프에서 내보내 만듭니다.
AI(어도비 일러스트레이터): 일러스트레이터의 원본 벡터 파일입니다.
EPS: 오래된 벡터 형식이지만 호환 범위가 넓습니다.
SVG: 요즘 인쇄소는 대부분 받습니다.
고해상도 PNG: 벡터 파일이 없을 때 받아 주며, 인쇄 크기에 맞는 해상도만 확보되면 됩니다.

🖨️ 자수와 레이저 커팅이라면: 이 공정에는 경로가 깔끔하게 정리된 벡터가 필요합니다. 그라데이션이나 그림자, 사진 효과가 들어간 로고는 제작에 넘기기 전에 단순하게 다듬어야 합니다. 원본 벡터가 없다면 디자이너가 PNG를 보고 벡터로 다시 그려 주는 "벡터화" 작업을 할 수 있습니다.

용도에 맞게 로고 크기 바꾸기

고해상도 PNG(최소 1000×1000px)나 SVG 원본이 준비됐다면, ImageTools의 이미지 크기 조절 도구로 플랫폼별 크기에 맞추면 됩니다. 가로와 세로를 픽셀 단위로 정확히 지정할 수 있고, 원본 비율을 유지하거나 새로 조정할 수도 있습니다.

로고 버전을 준비하는 권장 순서는 다음과 같습니다.

언제나 가진 것 중 가장 해상도가 높은 파일에서 시작합니다. SVG나 1000px 이상의 PNG가 좋습니다.
이미지 크기 조절 도구로 목적지에 맞는 크기로 바꿉니다.
SNS에 올릴 것이라면 이미지 압축 도구로 가볍게 압축합니다. 선명함을 지키려면 품질을 85~90%로 두세요.
인쇄물이라면 SVG를 그대로 넘기거나 벡터 PDF로 변환합니다.

어떤 용도든 로고 크기를 맞춰 보세요

비율을 망가뜨리지 않고 픽셀 단위로 정확하게 로고 크기를 조절할 수 있습니다.

무료로 로고 크기 조절하기

로고 크기를 다룰 때 흔한 실수

모든 자리에 같은 파일 쓰기

2000px 로고를 이메일 서명에 넣으면 느리게 뜨는 데다 화면을 가득 채웁니다. 반대로 100px 로고를 A4로 인쇄하면 계단처럼 깨집니다. 자리마다 알맞은 크기가 따로 있으니, 이 가이드를 기준 삼아 쓰기 전에 크기를 맞추세요.

어두운 배경용 버전을 만들지 않기

많은 로고가 밝은 배경 위의 어두운 색으로 처음 만들어집니다. 인스타그램 스토리나 링크드인 커버처럼 검거나 색이 있는 배경에서는 로고가 그대로 사라져 버립니다. 주요 요소를 흰색이나 밝은 색으로 바꾼 버전을 반드시 만들어 두세요.

SNS용으로 지나치게 큰 PNG 저장하기

인스타그램 프로필 사진에 2000×2000px PNG를 올려도 화면에 보이는 품질은 나아지지 않습니다. 인스타그램이 필요한 크기를 넘는 것은 모두 압축해 버리기 때문입니다. 권장 크기인 320×320px에 품질 90% 정도로 압축해 올리면 플랫폼이 다시 압축하는 이중 손실을 피할 수 있습니다.

투명 배경 로고를 JPG로 저장하기

JPG는 투명도를 지원하지 않습니다. 투명 배경 PNG 로고를 JPG로 저장하면 투명한 부분이 흰색으로 채워집니다. 여러 색의 배경 위에 올려야 해서 투명 배경이 필요하다면 반드시 PNG나 WebP를 쓰세요.

SVG를 두고 작은 PNG를 키우기

SVG 파일이 있다면 크기를 바꿀 때 언제나 SVG에서 출발하세요. 작은 PNG를 키우면 계단 현상이 생기고, 원본 벡터 없이는 되돌릴 수 없습니다.

아직 로고가 없다면, 지금 만들어 보세요

아직 로고가 없거나 더 전문적인 버전을 만들고 싶다면 ImageTools에 두 가지 도구가 있습니다. 아이콘과 색, 서체를 직접 고르며 세세하게 다듬는 로고 만들기와, 브랜드를 설명하면 AI가 내려받을 수 있는 벡터 시안을 만들어 주는 AI 로고 만들기입니다. 두 도구 모두 SVG와 PNG로 내보내므로, 이 가이드에 나온 모든 용도에 그대로 쓸 수 있습니다.

지금 내 브랜드 로고 만들기

결과물은 SVG와 투명 배경 PNG로 나옵니다. 웹사이트, SNS, 인쇄물에 바로 쓸 수 있습니다.

로고 만들기 AI로 로고 만들기

자주 묻는 질문

사이트 헤더에 넣을 로고는 어느 크기가 좋나요?

하나로 정해진 크기는 없고 레이아웃에 따라 달라집니다. 대부분의 사이트는 헤더에 가로 150~400px 로고를 쓰고, 세로는 디자인에 맞춰 비례하게 둡니다. 중요한 것은 파일 형식입니다. 어떤 화면에서도 깨지지 않는 SVG를 쓰거나, PNG라면 레티나 화면을 감안해 표시 폭의 두 배로 준비하세요. 표시 크기는 파일이 아니라 CSS로 조정하는 것이 맞습니다.

가로형 로고인데 SNS의 원형 프로필 사진에는 어떻게 쓰나요?

아이콘과 이름이 나란히 놓인 가로형 로고는 원형 프로필에서 잘 맞지 않습니다. 글자가 읽기 어려울 만큼 작아지거나 양 끝이 잘려 나가기 때문입니다. 가장 좋은 방법은 심볼이나 이니셜만 정사각형 안에 가운데로 배치한 "아이콘 버전"을 따로 만들어 프로필 전용으로 쓰는 것입니다. 가로형 로고를 정사각형 안에 두고 좌우 여백을 넉넉히 주는 방법도 있지만, 로고가 원하는 것보다 작아지기 쉽습니다.

로고를 키우면 왜 계단처럼 깨지나요?

픽셀로 이루어진 PNG 파일을 원본보다 크게 표시하고 있기 때문입니다. PNG는 해상도가 고정되어 있어서, 키우면 되돌릴 수 없는 계단 현상이 생깁니다. 여러 크기로 써야 하는 로고라면 제한 없이 확대해도 깨지지 않는 형식은 SVG뿐입니다. PNG만 있다면 원본의 120%를 넘겨 키우지 마세요.

명함에 넣을 로고는 어느 크기여야 하나요?

표준 명함(9×5cm)에는 보통 가로 2~4cm의 로고가 들어갑니다. 인쇄 표준인 300DPI로 환산하면 가로 236~472픽셀쯤 됩니다. SVG 파일이 있다면 인쇄소나 명함을 만들 디자이너에게 그대로 넘기세요. SVG는 인쇄에 필요한 정확한 크기로 조정되면서도 화질이 전혀 떨어지지 않습니다.

사이트의 라이트 모드와 다크 모드에 로고를 따로 준비해야 하나요?

네, 강력히 권합니다. 짙은 파란색 로고는 다크 모드의 어두운 헤더에서 완전히 사라집니다. 가장 깔끔한 방법은 CSS 미디어 쿼리 prefers-color-scheme 를 쓰거나 HTML의 <picture> 태그에 media 속성을 더해, 사용자의 시스템 설정에 따라 밝은 버전과 어두운 버전이 자동으로 바뀌게 하는 것입니다. 방문자가 따로 할 일은 없습니다.

유튜브 배너의 안전 영역이란 무엇이고 왜 중요한가요?

유튜브 배너(채널 아트)는 휴대폰부터 65인치 스마트 TV까지 화면 크기가 제각각인 기기에 표시됩니다. 파일은 2560×1440px이지만 기기마다 보이는 부분이 다릅니다. 가운데 1546×423px 영역인 "안전 영역"만이 모든 기기에서 반드시 보이는 자리입니다. 로고와 글자, 중요한 요소는 이 안에 들어가야 합니다. 나머지는 화면에 따라 잘려 나갈 수 있는 배경으로 생각하세요.