파비콘 생성기

언제 사용하나요?

웹사이트 배포 전에 favicon, apple-touch-icon, PWA 아이콘용 이미지를 빠르게 만들어야 할 때 사용합니다.

사용 방법

• 정사각형에 가까운 원본 이미지를 선택합니다.
• 파비콘 생성을 누릅니다.
• 필요한 사이즈의 PNG를 저장합니다.

입력값 안내

가급적 1:1 비율(정사각형)의 원본 이미지(PNG 또는 JPG)를 업로드합니다.

계산·변환 기준

입력된 원본 이미지를 바탕으로 웹 표준에서 요구하는 16x16, 32x32, 48x48, 192x192, 512x512 등 다양한 사이즈로 자동 리사이징하여 패키지로 묶습니다.

사용 예시

• 사이트 아이콘 제작 - 16, 32, 48, 180, 192, 512px 아이콘을 생성합니다.
• PWA 아이콘 준비 - Progressive Web App에 필요한 192×192, 512×512 아이콘을 한 번에 만듭니다.
• 애플 터치 아이콘 생성 - iOS Safari 홈 화면에 추가할 때 쓰이는 180×180 apple-touch-icon을 생성합니다.

예시

• 512x512 해상도의 회사 로고 이미지 업로드 → 모든 브라우저 및 OS 지원 파비콘 세트 일괄 생성
• 정사각 로고 → 브라우저 탭·홈 화면·PWA용 아이콘 세트 일괄 생성
• 브랜드 로고 PNG → 16, 32, 48, 180, 192, 512px 아이콘 6종 동시 생성
• 투명 배경 SVG 로고 → PNG 아이콘 세트로 변환 후 site.webmanifest에 등록 준비
• 앱 아이콘 → iOS용 apple-touch-icon 180×180px 포함 패키지 생성
• 포트폴리오 사이트 로고 → favicon.ico + PNG 세트 한 번에 다운로드

주의사항

• 브라우저 캔버스를 이용해 이미지를 처리하므로 원본 메타데이터(EXIF)가 손실되거나 투명 영역 색상이 변할 수 있습니다.
• 브라우저 환경의 이미지 디코딩 용량 한계로 인해, 지나치게 해상도가 높은 대용량 원본 파일의 변환은 실패할 수 있습니다.

자주 묻는 질문

ICO 파일도 생성하나요?

현재는 브라우저 Canvas 기반 PNG 아이콘을 생성합니다.

업로드한 로고가 서버에 저장되나요?

아니요. 원본 이미지는 브라우저 안에서만 읽혀 아이콘으로 변환되고 외부 서버로 전송되지 않습니다.

어떤 원본 크기가 좋나요?

512×512 이상의 정사각형 이미지를 넣으면 모든 크기의 아이콘이 선명하게 생성됩니다.

어떤 크기가 생성되나요?

16×16, 32×32, 180×180(애플 터치 아이콘), 192×192, 512×512 등 웹과 앱에서 자주 쓰는 PNG 크기를 함께 만들어 줍니다.

관련 도구

• 이미지 리사이즈 - 여러 이미지를 서버 업로드 없이 브라우저에서 비율을 유지하며 리사이즈합니다. JPEG·PNG·WebP 등을 지원하며 최대 가로·세로 픽셀을 지정하면 해상도가 일괄 축소됩니다.
• 이미지 크롭 - 픽셀 좌표를 입력해 이미지의 필요한 영역만 브라우저에서 잘라냅니다.
• 이미지 회전/뒤집기 - 이미지를 90도 단위로 회전하거나 좌우·상하로 뒤집습니다.
• 이미지 압축기 - 품질과 최대 크기를 조정해 이미지 용량을 브라우저에서 줄입니다.
• 이미지 색상 추출기 - 이미지 픽셀을 브라우저에서 분석해 주요 색상 HEX 코드를 추출합니다.
• 이미지 워터마크 추가 - 이미지 위에 텍스트나 로고 워터마크를 위치와 투명도까지 조절해 추가합니다.