PWA Manifest 빌더
PWA manifest는 브라우저와 OS에 웹 앱을 어떻게 설치하고 표시할지 알림: 실행 아이콘·스플래시 컬러·풀스크린 vs 브라우저 크롬·지원 방향·딥링크 스코프. 이 빌더는 실제로 필요한 필드로 스펙 준수 `manifest.json` 생성 — Android 안전 영역용 maskable 변형 포함 합리적 기본 아이콘 세트(192px·512px). 출력엔 `<link rel="manifest">` 와 Apple 전용 `apple-mobile-web-app-*` 메타 태그도 포함 — Apple은 아직 완전한 manifest 지원 안 했고 크로스 플랫폼 설치 가능성엔 둘 다 필요. 전부 편집 가능; 입력하면 JSON 재생성.
{
"name": "My App",
"short_name": "MyApp",
"description": "A progressive web app",
"start_url": "/",
"scope": "/",
"display": "standalone",
"theme_color": "#0ea5e9",
"background_color": "#ffffff",
"lang": "en",
"categories": [
"productivity",
"utilities"
],
"icons": [
{
"src": "/icons/icon-192.png",
"sizes": "192x192",
"type": "image/png",
"purpose": "any"
},
{
"src": "/icons/icon-512.png",
"sizes": "512x512",
"type": "image/png",
"purpose": "any"
}
]
}<link rel="manifest" href="/manifest.json" /> <meta name="theme-color" content="#0ea5e9" /> <meta name="apple-mobile-web-app-capable" content="yes" /> <meta name="apple-mobile-web-app-status-bar-style" content="default" /> <meta name="apple-mobile-web-app-title" content="MyApp" /> <link rel="apple-touch-icon" href="/icons/icon-180.png" />
manifest.json은 `Content-Type: application/manifest+json`로 서빙. Lighthouse PWA 감사가 누락 필드 표시.
사용법
- name + short_name 설정(short_name은 홈 화면 표시 — 12자 미만 권장). start_url은 실행 시 열릴 위치.
- 디스플레이 모드 선택: `standalone`(브라우저 UI 없음, 권장)이 가장 흔함. `fullscreen`은 상태 바 숨김, `minimal-ui`는 얇은 브라우저 셸 유지.
- 아이콘 추가. 기본값은 Android(192/512)·적응형 아이콘용 maskable 변형 커버. JSON은 `manifest.json`에, HTML은 `<head>`에 복사.
자주 묻는 질문
- Maskable 아이콘이란?
- Android 적응형 아이콘은 시스템 정의 도형(원·스퀴클·둥근 사각형)으로 아이콘을 크롭. `purpose: maskable` 아이콘은 로고 주변에 안전 영역 패딩 포함 → 크롭이 가장자리 잘라먹지 않음. 192/512에서 로고 주변 ~20% 패딩으로 maskable 변형 생성.
- manifest.json과 Apple 메타 태그 둘 다 필요?
- iOS에서 홈 화면 추가 원한다면 yes. Apple은 부분 manifest 지원(theme_color·`apple-touch-icon` 통한 아이콘)하나 대부분 무시. `apple-mobile-web-app-capable` 메타가 실제로 iOS가 사이트를 독립 앱으로 취급하게 함.
관련 도구
Favicon 생성기 (멀티 사이즈 PNG)
이미지 하나로 10개 사이즈 favicon PNG 생성(16·32·48·64·96·128·180·192·256·512) — HTML 스니펫까지.
/.well-known/* URI 레퍼런스
IANA 등록 well-known URI 검색 카탈로그 — `security.txt`·`openid-configuration`·`apple-app-site-association`·`acme-challenge` 외 30+개, RFC 레퍼런스·사용 사례 포함.
JWT 디코더
JWT의 헤더·클레임·만료를 즉시 확인하세요.
Plist 뷰어 (바이너리·XML)
애플 속성 목록(plist)을 바이너리든 XML이든 열어 트리로 보고, JSON이나 XML plist로 변환합니다.
JSON Patch 빌더 (RFC 6902)
source/target 쌍에서 RFC 6902 JSON Patch 생성, 또는 기존 patch를 문서에 적용. add·remove·replace·move·copy·test 작업 지원.
JSON 포맷터 & 검증기
브라우저에서 바로 JSON을 포맷·정렬·압축·검증하세요.