Icon Workshop1이미지 업로드
선명한 로고나 단순한 심볼을 사용하세요. 정사각형 이미지가 가장 적합합니다.
이미지 한 장을 모든 화면에.
파비콘·앱 아이콘 생성기
작은 아이콘. 오래 남는 인상.
이미지를 웹사이트 파비콘, 앱 아이콘, 바로 사용할 수 있는 아이콘 패키지로 변환하세요.
PNG ICO PWA
아이콘 패키지 만들기
이미지로 파비콘과 앱 아이콘 등을 만드세요.
- 1업로드
- 2조정
- 3다운로드
여기에 이미지를 드롭하세요
PNG, JPG 또는 SVG · 최대 5 MB
이미지는 브라우저 안에서 처리되며 기기 밖으로 전송되지 않습니다.
아이콘 조정
모든 화면에 어울리도록 모양을 세밀하게 조정하세요.
실제 사용 모습 확인(이미지를 업로드하면 아이콘을 미리 볼 수 있습니다)
브라우저 탭
×
https://example.com
iOS 홈 화면
여기에 아이콘 표시
PWA / Android
여기에 아이콘 표시
세 단계로 파비콘 만들기
이미지 한 장으로 아이콘 한 세트를 완성하세요.
2조정하고 미리보기
맞춤 방식, 배경, 안쪽 여백을 선택하세요. 작은 크기에서도 결과를 확인하세요.
3다운로드 후 사이트에 추가
아이콘 패키지를 내보내고 파일을 업로드한 뒤, HTML에 아이콘 링크를 추가하세요.
로고 하나로 모든 화면을 준비하세요
생성된 파일이 어디에서 사용되는지 확인하십시오.
웹사이트 파비콘
내 사이트×16 × 1632 × 3216 × 16 및 32 × 32 아이콘은 탭과 북마크에서 방문자가 사이트를 알아보게 해 줍니다.
iPhone & iPad
내 사이트180 × 180홈 화면에 사이트가 추가되면 180 × 180 애플 터치 아이콘을 사용하십시오.
PWA & Android
앱 설치192 × 192512 × 512192 × 192 및 512 × 512 이미지는 웹 앱 매니페스트에서 흔히 사용하는 크기입니다.
아이콘 패키지에는 무엇이 들어 있나요?
여러 플랫폼에서 바로 사용할 수 있는 아이콘 세트.
- favicon.ico16 × 16, 32 × 32, 48 × 48, 256 × 256
- apple-touch-icon.png180 × 180
- icon-192.png192 × 192
- icon-512.png512 × 512
- site.webmanifest웹 앱 매니페스트
웹사이트에 아이콘 추가
이 링크를 HTML <head>에 넣으십시오.
<link rel="icon" type="image/x-icon" href="/favicon.ico">
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
<link rel="manifest" href="/site.webmanifest">자주 묻는 질문
파비콘이란 무엇인가요?
브라우저 탭과 북마크에서 웹사이트를 나타내는 작은 이미지입니다.
어떤 이미지 형식을 사용해야합니까?
투명한 로고에는 PNG가 좋습니다. JPG, WebP, 안전한 SVG도 사용할 수 있습니다.
정사각형이 아닌 이미지도 사용할 수 있나요?
네. '맞춤', '자르기', '늘이기'를 선택해 정사각형 아이콘을 만드세요.
왜 여러 크기의 아이콘이 포함되나요?
브라우저와 홈 화면은 서로 다른 크기를 사용합니다. 작은 아이콘은 탭에서 선명하게 보이고, 큰 아이콘은 앱 바로가기에 적합합니다.