--- url: "/ko/favvy/export.md" description: "Figma 레이어를 선택한 다음 Favvy 플러그인에서 **Export Favicons** 버튼을 클릭하면, 레이어로 바로 쓸 수 있는 코드와 파비콘 .zip 파일을 생성해요." --- # Figma 프레임을 파비콘으로 내보내기 > Figma 레이어를 선택한 다음 Favvy 플러그인에서 **Export Favicons** 버튼을 클릭하면, 레이어로 바로 쓸 수 있는 코드와 파비콘 .zip 파일을 생성해요. [Video](/assets/videos/favvy/create/export-favicons.mp4) > **Note:** **선택한 레이어는 너비와 높이가 같은 정사각형 비율이어야 해요**(예: **512x512**픽셀). 정사각형이 아닌 레이어를 선택하면 Favvy가 알려 줘요. **Export Favicons** 버튼은 정사각형 레이어 하나를 선택하기 전까지, 그리고 Favvy가 현재 파비콘 패키지를 생성하는 동안에는 사용할 수 없어요. 버튼에 마우스를 올리면 사용할 수 없는 이유를 확인할 수 있으며, 생성이 끝날 때까지 기다린 다음 다시 내보내세요. **Export Favicons** 버튼을 클릭하면 **HTML code for your website's tag** 창이 표시돼요. Figma에서 컴퓨터로 `.zip` 파일을 다운로드하려면 Favvy 플러그인에서 **Download favicons .zip file** 버튼을 클릭하세요. > **Tip:** **Figma에서 다운로드한 파일 저장하기** Figma **데스크톱 앱**을 사용한다면 파일을 다운로드하라는 창이 나타나요. 하지만 **웹 브라우저**에서 Figma를 사용한다면 기본적으로 파일이 컴퓨터에 자동으로 다운로드돼요(보통 컴퓨터의 **Downloads** 폴더에 저장돼요). ## 내보낸 Favvy .zip 파일에는 무엇이 들어 있나요? {#what-s-in-the-exported-favvy-zip-file} 선택한 내보내기 형식에 따라, Favvy에서 내보낸 `.zip` 파일에 포함될 수 있는 파일 전체 목록은 다음과 같아요. - `android-chrome-192x192.png` - `android-chrome-512x512.png` - `apple-touch-icon.png` - `favicon.ico` - `favicon.svg` - `head.html` - `site.webmanifest` ## 기타 Favvy 내보내기 옵션 {#other-favvy-export-options} 파비콘을 내보내기 전에 웹사이트 이름과 테마 색상을 선택적으로 지정할 수 있어요. Favvy는 Figma 파일마다 웹사이트 이름, 테마 색상, 플랫폼 스위치를 기억해요. ### 웹사이트 이름 {#website-name} **Website Name** 입력 필드에 웹사이트 이름을 입력하면, 내보낸 `site.webmanifest` 파일의 `name`과 `short_name` 필드에 자동으로 추가돼요. `site.webmanifest` 파일은 프로그레시브 웹 앱(PWA)에서 사용돼요. 관심이 있다면 MDN 웹 문서에서 [웹 앱 매니페스트에 대해 자세히 알아보세요](https://developer.mozilla.org/en-US/docs/Web/Manifest). ### 테마 색상 {#theme-colour} **Theme Colour** 입력 필드에 HEX 색상 코드를 입력하면(또는 색상 선택기를 사용하면), `` 태그용으로 생성된 코드의 `theme-color` 필드에 자동으로 추가되고 iOS 스플래시 화면 배경에도 사용돼요. ### 크기 및 플랫폼 {#sizes-platforms} Default (Required)는 항상 포함돼요. **iOS (Icons)** 옵션과 **Android (PWA Icons)** 옵션은 기본으로 켜져 있으며, 필요 없다면 끌 수 있어요. iOS 스플래시 화면을 추가하려면 **iOS (PWA Splash Screen)** 옵션을 켜세요. 이 옵션을 쓰려면 **iOS (Icons)** 옵션이 켜져 있어야 해요.