DevToolKits.app
DevToolKits

파비콘 생성기

현대적인 웹사이트를 위한 파비콘(ICO, PNG)을 생성합니다. 필요한 모든 크기(16x16 ~ 512x512)를 한 번에 만듭니다.

가이드: 사용 방법 및 특징

  • 정사각형에 가까운 로고 이미지를 업로드하거나 드래그 앤 드롭 하세요.
  • 미리보기를 통해 각 사이즈별 파비콘의 결과물을 확인할 수 있습니다.
  • 「Download ZIP」 버튼을 눌러 모든 아이콘과 HTML 코드를 한꺼번에 저장하세요.

샘플: 입출력 예시

512x512 로고로부터 생성 예시

입력 예시

입력: logo-512x512.png

출력 예시

생성물:
- favicon.ico (16,32,48)
- apple-touch-icon.png (180x180)
- icon-192.png, icon-512.png

FAQ: 자주 묻는 질문

  • favicon.ico 파일 안에는 무엇이 들어있나요?

    호환성을 위해 16x16, 32x32, 48x48 등 3가지 사이즈를 하나의 파일로 패킹하여 생성합니다.
  • 고해상도 이미지를 업로드해도 되나요?

    네. 브라우저에서 리사이징을 수행하므로 수 MB 정도의 큰 이미지도 원활하게 처리할 수 있습니다.
  • ZIP 파일 안의 결과물은 어떻게 사용하나요?

    아이콘들을 public 디렉토리 등에 배치하고, 동봉된 HTML 스니펫을 <head> 태그 안에 붙여넣으세요.

활용: 주요 활용 사례

  • 신규 프로젝트 시작

    로고 하나로 iOS, Android, 데스크톱 등 모든 환경에 최적화된 아이콘 세트를 한 번에 만듭니다.

  • 기존 사이트 아이콘 갱신

    별도 설치 없이 브라우저에서 최신 명세에 맞는 .ico와 .png 세트를 안전하게 다시 생성합니다.

  • 프로토타입 및 목업 제작

    임시 로고로부터 HTML 코드까지 포함된 세트를 준비해 실제 결과물에 가까운 모습을 빠르게 확인합니다.

주의: 주의사항 및 제한

  • 이미지 비율 주의

    정사각형이 아닌 이미지를 업로드하면 아이콘 크기에 맞게 잘리거나 늘어날 수 있습니다.

  • 브라우저 캐시

    파비콘 보기는 브라우저 캐시의 영향을 많이 받습니다. 반영되지 않는 경우 강력 새로고침이나 시크릿 모드를 이용해 보세요.

드래그 앤 드롭 또는 클릭

PNG, JPG, SVG, WebP

16x16

favicon-16x16.png

32x32

favicon-32x32.png

ICO Multi-size

favicon.ico

180x180 (Apple)

apple-touch-icon.png

192x192 (Android)

android-chrome-192x192.png

512x512 (Android)

android-chrome-512x512.png

Favicon 생성기

기준 이미지에서 favicon.ico와 여러 PNG icon 크기를 생성합니다. 브라우저 탭, 북마크, 홈 화면, 사이트 metadata에 필요한 기본 아이콘을 준비할 때 유용합니다.

활용 예시

  • 새 사이트 출시: 로고에서 favicon asset을 만듭니다.
  • 브랜드 리뉴얼: 디자인 변경 후 아이콘을 다시 생성합니다.
  • 모바일 shortcut 준비: 홈 화면과 브라우저용 아이콘을 만듭니다.

작은 아이콘은 세부 요소가 쉽게 뭉개집니다. 단순하고 중앙에 배치된 형태를 사용하세요.

이 도구의 관련 기사

Recent Articles

도구 소개
2026-05-02

CSV와 JSON 변환: API 연동과 데이터 이전에서 형식을 고르는 방법

CSV와 JSON을 안전하게 변환하기 위한 헤더, 구분자, 값 타입, 중첩 데이터 처리, 실무 활용 흐름을 설명합니다.

도구 소개
2026-05-02

JSON 포맷팅과 검증: API 응답을 안전하게 확인하는 방법

JSON을 보기 좋게 정리하고, 문법 오류와 값의 타입을 확인하며, TypeScript 타입과 Zod, OpenAPI 스키마로 이어지는 실무 흐름을 설명합니다.

개발 이야기
2026-04-06

아무도 아키텍처 다이어그램을 업데이트하지 않는 문제에 대하여

'잠깐, 중간에 서버가 하나 더 있지 않나요?' 누군가 이렇게 물어볼 때 느끼는 그 서늘함. 실시간 웹 기반 Mermaid 인프라 시각화 도구를 만들게 된 이야기입니다.

개발 이야기
2026-04-05

YAML 지옥에서 정신줄 놓기: 내가 CI/CD 시각화 도구를 만든 이유

GitHub Actions의 'needs' 의존성이 인간의 눈으로 파악하기엔 너무 혼란스러워졌을 때, YAML 미로를 깔끔한 순서도로 바꾸기로 결심했습니다.

개발 이야기
2026-04-04

JOIN 때문에 울지 마세요: 비주얼 SQL 빌더 개발 비화

'잠깐, LEFT JOIN이 어떻게 작동하더라?' 쉼표 누락이나 구문 오류를 디버깅하느라 시간을 낭비하지 않도록 이 노코드 SQL 도구를 만들었습니다.

개발 이야기
2026-03-09

재귀로 푸는 JSON→TypeScript 변환: 외부 라이브러리에 의존하지 않는 강점

API 응답에서 순식간에 타입 정의를 생성. 외부 파서 없이 재귀 알고리즘으로 가볍고 빠르게 구현한 뒷이야기를 소개합니다.