[웹인] Google 사이트 도구 (22) - 배경이 있는 favicon 이미지 만들기

본 게시물에서는 배경이 있는 이미지를 그대로 favicon 이미지로 만드는 방법에 대해 알아보자.

브라우저를 실행하고 [http://genfavicon.com/]에 접속한다. [Genfavicon]은 이미지를 바로 파비콘으로 만들어주는 사이트이다.

[Select your image]에 있는 [파일 선택]을 누른다.

[열기] 창에서 'UI.png'를 선택한 후 [열기] 버튼을 누른다. 'UI.png'는 본 게시물의 하단에 첨부되어 있다.

파일 선택을 마친 후 [Upload image] 버튼을 누른다.

그러면 사이트 오른쪽에 있는 이미지 영역에 선택한 이미지가 나타나게 된다. 파비콘 영역을 표시하는 각 포인트를 조정해보자.

[Cut & Preview]에서 [Select the Size]를 32 x 32로 한 후 [Capture & Preview] 버튼을 누른다.

[Favicon resulting]에서 [Download Favicon] 링크를 누른다.

그러면 폴더에 아래 그림과 같이 32 x 32 픽셀 크기의 'favicon.ico' 파일이 저장된다. 이 파일은 배경이 투명하지 않고 그대로 남아 있는 일반 파비콘 이미지 파일이다. [Google 사이트 도구]에서는 반드시 'favicon.ico'로 파일명이 되어야만 파비콘으로 동작하게 된다.

※ 첨부 파일 (마우스 오른쪽 버튼을 눌러 다운받는다.)