צילומי מסך מציגים את האפליקציה באנגלית. שמות ופקדים מוגדרים מראש זמינים גם בשפת האפליקציה שלך.
נקודת המוצא שלך
השתמש ב-ערכת Favicon ב-PixRinse, ולאחר מכן בדוק את ההגדרות הללו מול היעד האמיתי שלך.
| Favicon PNGs | 16 / 32 / 48 px |
|---|---|
| Apple גע בPNG | 180 px |
| PNG של אפליקציות אינטרנט | 192 / 512 px |
| צֶבַע | sRGB |


איך לעשות את זה
הכינו סימן מקור מרובע
השתמש במקור גדול לפחות כמו הסמל הגדול ביותר שאתה צריך. פשט פרטים עדינים שעלולים להיעלם ב-16 px.
בחר ערכת Favicon
סקור את ששת הגדלים. התבנית משתמשת בכלל כיסוי ממורכז, כך שמקור שאינו מרובע עשוי להיחתך.
בדוק את התפוקות הקטנות ביותר
בדוק את הקבצים 16 ו32 px בגודל אמיתי. שינוי גודל אוטומטי אינו יכול להחליף התאמות אופטיות מכוונות עבור סימן מותג מורכב.
ייצא תמונות והוסף את ההפניות שלהן לקוד האתר שלך
הוסף את קבצי PNG לאתר שלך והתייחס לגדלים הרלוונטיים במניפסט HTML ראש ו-web-app.
הקבצים מתוך ההליכה הזו
מה שהדוגמה הזו יצרה
סימן ריבועי 1024 × 1024 מייצר שישה PNGs ללא האזהרה שאינה מקור מרובע. כל קובץ מיוצא מכיל פרופיל sRGB.
- מקור מרובע
- 1024 × 1024
- PNG ייצוא
- 6
- פרופיל צבע
- sRGB בכל פלט
| קוֹבֶץ | פוּרמָט | פיקסלים | בתים |
|---|---|---|---|
| android-chrome-192x192.png | PNG | 192 × 192 | 26,980 |
| android-chrome-512x512.png | PNG | 512 × 512 | 174,868 |
| apple-touch-icon.png | PNG | 180 × 180 | 23,839 |
| favicon-16x16.png | PNG | 16 × 16 | 692 |
| favicon-32x32.png | PNG | 32 × 32 | 1,751 |
| favicon-48x48.png | PNG | 48 × 48 | 3,093 |

נמדד בקבצים לדוגמה המוצגים. התוצאות שלך תלויות במקורות ובהגדרות שלך. הדרכה זו משתמשת ביצירות אמנות PixRinse בבעלות על קנבסים מרובעים או שקופים לדוגמה.
כמה שאלות נפוצות
האם זה יוצר favicon.ico?
לא. הסט המובנה מייצא שישה קבצי PNG עם שמות קבצים ספציפיים.
האם לוגו רחב יעבוד?
עדיף מקור מרובע. כלל הכיסוי יכול לחתוך מקור רחב, אז סקור את התצוגה המקדימה בזהירות.
הפעל את זרימת העבודה.
פתח את PixRinse, הוסף כמה תמונות והתחל עם ההגדרות שלמעלה.
הורדה ל‑Macחינם: עד 10 תמונות לכל אצווה ופלט אחד לכל מקור. הפלטים המרובים של זרימת העבודה הזו דורשים Pro. השווה חינם ופרו.