파비콘 만들기 — PNG 아이콘·ICO 파일 생성

이미지로 16~512px PNG 아이콘과 16·32·48·64·256px를 담은 ICO 파일을 만드세요. 파비콘을 미리 확인하고 필요한 파일을 다운로드합니다.

이미지 가장자리를 자르지 않고 표준 아이콘 크기를 만듭니다.

또는 이 화면 어디에나 이미지 한 장을 놓으세요

favicon.ico에는 16, 32, 48, 64, 256px 프레임이 들어갑니다. PNG는 표시된 크기로 저장되며 180px는 apple-touch-icon.png로 저장됩니다.

이미지를 선택하세요.

ICO와 PNG 파비콘 만들기

알아 두면 좋은 점

원본 한 장에서 두 종류의 결과가 나와요. favicon.ico 버튼은 16, 32, 48, 64, 256px 프레임 다섯 개가 든 ICO 파일 하나를 만들고, PNG 버튼 여덟 개는 16, 32, 48, 64, 180, 192, 256, 512px 파일을 각각 만들어요. 180px PNG는 apple-touch-icon.png로, 나머지는 favicon-16.png, favicon-32.png처럼 저장돼요.

원본은 먼저 512 x 512 정사각형 안에 자르지 않고 맞춰져요. 가로로 긴 로고는 폭이 맞을 때까지 줄어들고 위아래 빈 띠는 투명하게 남아서 가장자리가 잘리지 않아요. 편하지만 여백이 조금 있는 정사각형 원본이 배너 모양 원본보다 탭 아이콘이 더 커 보여요.

입력은 PNG, JPG, WebP, GIF, SVG, AVIF, BMP를 한 번에 한 장씩 쓸 수 있고, 두 번째 이미지를 놓으면 첫 번째가 교체돼요. 움직이는 GIF는 정지 프레임 하나만 쓰이고, SVG는 512px 크기로 래스터화돼서 벡터 로고도 선명해요.

일반적인 사이트 설정은 기본으로 요청하는 브라우저를 위해 루트의 favicon.ico, iOS 홈 화면용 180px apple-touch-icon.png, 웹 앱 매니페스트의 192·512px PNG를 써요. 모든 크기의 미리보기 타일이 화면에 있어서, 아무것도 내려받기 전에 16px에서 마크가 어떻게 보이는지 확인할 수 있어요.

입력·출력 예제

16 × 16픽셀에서도 알아볼 수 있는 단순한 로고를 사용하세요. 원본을 늘이지 않고 정사각형 안에 맞추므로 원본이 정사각형이 아니면 투명 여백이 생깁니다. PNG는 크기별 이미지이고 ICO는 여러 크기를 한 파일에 담습니다.

입력

PNG / JPG / WebP / GIF / SVG / AVIF / BMP

결과

ICO: 16, 32, 48, 64, 256 px
PNG: 16, 32, 48, 64, 180, 192, 256, 512 px

다운로드한 파일을 웹사이트에 올리고 HTML에서 아이콘 파일을 연결해야 적용됩니다. 파비콘을 생성하는 것만으로 사이트에 설치되지는 않습니다. 게시 전 작은 미리보기를 확인하세요. 세밀한 글자는 잘 보이지 않을 수 있습니다.

로고로 파비콘 만들기: 작은 탭에서도 알아보이게

파비콘은 웹사이트 탭에 표시되는 작은 아이콘입니다. 큰 로고를 그대로 줄이기보다 16 × 16에서도 구분되는 모양을 고르고, 필요한 파일을 만든 다음 웹사이트에 연결하는 단계까지 확인하세요.

가로형 로고보다 짧고 단순한 심벌로 시작하세요

회사 이름이 길게 들어간 로고는 작은 탭에서 읽기 어렵습니다. 브랜드를 구분할 수 있는 짧은 글자나 심벌을 준비하고, 배경과의 대비를 확인하세요. Chatcument 생성기는 원본 전체를 정사각형 안에 비율대로 맞추므로, 가로로 긴 원본은 위아래에 투명 여백이 생기고 실제 심벌이 작게 보일 수 있습니다.

미리보기에서는 큰 512px 결과만 보지 말고 16px·32px 결과도 확인하세요. 선이 너무 가늘거나 글자가 뭉개지면 더 큰 파일을 만드는 것보다 원본 디자인을 단순하게 정리하는 것이 도움이 됩니다.

PNG 파일과 ICO 파일은 어떻게 고르나요?

PNG는 선택한 크기의 단일 이미지입니다. ICO는 여러 크기를 한 파일에 담을 수 있으며 이 도구의 ICO에는 16·32·48·64·256px가 포함됩니다. PNG는 16·32·48·64·180·192·256·512px 중 필요한 결과를 받을 수 있습니다.

다운로드한 파일은 사용하는 웹사이트의 아이콘 설정이나 HTML 연결 방식에 맞춰 적용해야 합니다. PNG를 만들었다고 웹앱 설치용 manifest까지 자동 설정되는 것은 아닙니다. 사이트 제작 도구가 별도 업로드 영역을 제공한다면 해당 영역에서 요구하는 형식과 크기를 확인하세요.

파일을 만들었는데 탭 아이콘이 그대로라면

생성한 파일이 실제 공개 사이트에 올라갔는지 먼저 확인하세요. 이어서 아이콘 파일 주소가 열리는지, 페이지가 그 주소를 참조하는지 확인합니다. 파일 생성과 웹사이트 설치는 별개 단계입니다.

기존 아이콘이 캐시에 남아 있을 수도 있습니다. 새로 연 탭이나 다른 브라우저에서도 확인하고, 파일 위치나 파일 이름을 바꿨다면 페이지의 참조 주소도 함께 고치세요. 검색결과의 아이콘은 검색엔진의 재수집이 필요할 수 있어 탭 아이콘과 동시에 바뀐다고 보장할 수 없습니다.

지금 필요한 작업으로 이어가기

Chatcument 작성 · 2026년 9월 8일 기능 동작 기준

작업별 도구 7
함께 쓰는 도구 13
파비콘 만들기 — PNG 아이콘·ICO 파일 생성 사용 방법
  1. 512px 이상의 정사각형 PNG나 SVG 같은 이미지 한 장을 선택하거나 놓아요.
  2. 16~512px 미리보기 타일을 훑어보고 16px 타일도 읽히는지 확인해요.
  3. 여러 크기가 든 ICO는 favicon.ico 다운로드를 눌러요.
  4. 180px와 192px PNG도 내려받아 페이지 head와 매니페스트에 추가해요.

빠른 안내

웹사이트에 실제로 필요한 파일은 무엇인가요?

사이트 루트의 favicon.ico, iOS용 180px apple-touch-icon.png, 웹 앱 매니페스트를 쓴다면 192·512px PNG예요. 다른 크기는 선택 사항이에요.

가로로 긴 로고가 탭에서 왜 작게 보이나요?

전체 이미지를 정사각형 안에 맞추기 때문에 가로 로고는 얇은 띠만 차지해요. 마크의 정사각형 버전을 만들면 가장 좋아요.

움직이는 GIF는 어떻게 되나요?

정지 프레임 하나만 쓰여요. 여기서 만드는 파비콘 파일은 정적 이미지예요.

내려받는 파일 이름은 어떻게 되나요?

ICO는 favicon.ico, 180px PNG는 apple-touch-icon.png, 나머지는 favicon-16.png, favicon-32.png 같은 이름이에요.

파비콘을 다운로드하면 사이트에 자동 적용되나요?

아닙니다. 파일을 웹사이트에 게시하고 사이트 설정 또는 HTML에서 해당 아이콘을 연결해야 합니다. 이 도구는 PNG와 ICO 파일을 생성합니다.

로고가 파비콘에서 너무 작게 보이는 이유는 무엇인가요?

원본 전체를 비율대로 정사각형에 맞추기 때문일 수 있습니다. 가로로 긴 로고나 여백이 많은 이미지는 실제 심벌 영역이 작아집니다. 정사각형에 가까운 단순한 원본으로 다시 확인하세요.

파비콘을 바꾸면 검색 순위도 올라가나요?

파비콘은 사이트를 알아보는 데 도움을 주는 시각 요소입니다. 파일을 만들거나 교체했다고 검색 순위 상승이 보장되지는 않습니다. 검색결과 반영 여부도 별도로 확인해야 합니다.