텍스트 Favicon 생성기
최적의 효과를 위해 1-2자 사용을 권장합니다.
텍스트를 아이콘으로
임의의 텍스트를 입력하면 전문적인 favicon 아이콘을 자동으로 생성하며, 다양한 폰트와 스타일을 지원합니다.
사용자 정의 스타일
풍부한 사용자 정의 옵션, 폰트, 색상, 배경 모양 및 배경 이미지를 포함합니다.
실시간 미리보기
원하는 대로 조정하면 즉시 효과를 확인할 수 있습니다.
파비콘이란?
파비콘 (favorite icon의 줄임말) 는 브라우저 탭, 북마크 및 기타 인터페이스 요소에 표시되는 작은 아이콘입니다. 여러 개의 열린 탭과 북마크에서 사용자가 웹사이트를 빠르게 식별할 수 있도록 도와줍니다.
파비콘 사용 방법
파비콘을 웹사이트에 추가하려면 다음이 필요합니다:
- 우리의 도구를 사용하여 Favicon 압축 패키지를 생성하고 다운로드합니다.
- 다운로드한 ZIP 패키지를 압축 해제하고 모든 파일을 웹사이트 루트 디렉토리에 배치합니다.
- 웹사이트의 <head> 부분에 다음 HTML 코드를 추가합니다:
<link rel="icon" href="/favicon.ico" sizes="any">
<link rel="icon" type="image/png" href="/favicon-16x16.png" sizes="16x16">
<link rel="icon" type="image/png" href="/favicon-32x32.png" sizes="32x32">
<link rel="icon" type="image/png" href="/favicon-48x48.png" sizes="48x48">
<link rel="manifest" href="/site.webmanifest">
<link rel="icon" type="image/png" href="/android-chrome-192x192.png" sizes="192x192">
<link rel="icon" type="image/png" href="/android-chrome-512x512.png" sizes="512x512">
<link rel="apple-touch-icon" href="/apple-touch-icon.png">HTML다양한 형식 설명
ICO 형식 (.ico)
전통적인 favicon 형식으로, 모든 브라우저(Internet Explorer 구버전 포함)와 호환됩니다. 일반적으로 여러 크기(16x16, 32x32, 48x48)를 포함합니다.
PNG 형식 (.png)
현대 브라우저의 기본 형식으로, 투명 배경을 지원하고 파일 크기가 더 작습니다. 16x16은 탭, 32x32는 작업 표시줄, 48x48는 데스크톱 바로가기에 사용됩니다.
Android Chrome 아이콘
192x192 및 512x512는 Android 기기(PWA)의 아이콘으로, 사용자가 웹사이트를 메인 화면에 추가할 때 표시됩니다.
Apple Touch 아이콘
180x180은 iOS(iPhone, iPad) 기기용으로 설계되어 있으며, 사용자가 웹사이트를 메인 화면에 추가할 때 사용됩니다. Apple은 자동으로 모서리를 둥글게 하고 광택 효과를 추가합니다.
16px에서도 읽히는 텍스트 파비콘 디자인
텍스트 파비콘의 성패는 탭 크기에서 갈립니다. 텍스트 생성기에서는 이 매개변수들이 이미지 도구보다 더 중요합니다. 512px 미리보기에서 선명해도 실제 브라우저 탭에서는 알아볼 수 없게 뭉개질 수 있습니다.
글꼴 선택
굵은 산세리프(Arial Black, Helvetica Bold, Futura)가 16×16 렌더링에 가장 강합니다. 세리프·필기체·좁은 글꼴의 가는 획은 미리보기에서 선명해도 탭 크기에서는 사라지곤 합니다.
글자 수
한 글자가 이상적입니다. 두 글자 모노그램은 글꼴 크기를 한 단계 줄이면 사용할 수 있고, 세 글자 이상은 16px 탭에서 판독할 수 없으므로 긴 텍스트는 180×180 Apple 터치 아이콘 전용으로 남겨두세요.
전경/배경 대비
대비비 7:1 이상을 목표로 하세요. 탭은 라이트·다크 두 테마로 렌더링됩니다. 투명 배경의 중간 회색 텍스트는 한쪽에서 사라지고, 채워진 도형 + 흰색 텍스트는 양쪽에서 읽힙니다.
배경 모양
15-20% 코너 반경은 어떤 크기에서도 현대적인 앱 아이콘처럼 보입니다. 완전 투명 배경은 미리보기에서 깔끔하지만 어두운 탭 바 위에서는 판독이 어렵습니다. 배포 전 두 테마를 확인하세요.
여백
글자 모양을 캔버스의 60-70% 안에 유지하세요. 브라우저는 공칭 크기보다 작게 그립니다(고DPI에서 16px 아이콘을 더 큰 슬롯 안에 표시). 가장자리에 붙은 글자는 시각적으로 잘립니다.