17P by xguru 1달전 | favorite | 댓글과 토론

- 브라우저 스펙에 따라 수많은 파일이 필요한데, 이걸 하나로 정리
- 5개의 이미지와 한개의 JSON 파일
ㅤ→ .ico 32x32 : 예전 브라우저들
ㅤ→ .svg : 스케일링 가능, 대부분 최신 브라우저들, 다크모드도 지원
ㅤ→ apple-touch-icon 180x180 : 애플 기기용 iOS8+ 이후는 180x180 크기. 20px 정도 패딩과 배경색을 넣으면 보기 좋음
ㅤ→ manifest(JSON) : PWA 및 안드로이드 기기용
ㅤ ㅤ→ 192x192 : 홈스크린
ㅤ ㅤ→ 512x512 : PWA 로딩시 스플래시 스크린용

- 글에서는 이 5개의 아이콘을 한개의 SVG에서 만들고 최적화 하는 걸 단계별로 설명