สร้างแพ็กเกจ favicon ที่สมบูรณ์จากโลโก้ ไอคอนฟอนต์ หรืออักษรย่อ — favicon.ico, PNG สมัยใหม่, Apple touch icon, PWA icons, web manifest และโค้ด HTML

วางโลโก้ เลือกไอคอนฟอนต์ หรือพิมพ์อักษรย่อ — เราจะสร้าง favicon ทุกแบบที่เว็บไซต์สมัยใหม่ต้องการ ตั้งแต่ favicon.ico แบบดั้งเดิม ไปจนถึง Apple touch icon, PWA icons และโค้ด HTML ที่พร้อมวางใช้งาน

วาง PNG ที่นี่ หรือคลิกเพื่ออัปโหลด
แนะนำ PNG แบบโปร่งใส · รองรับ JPG / WebP ด้วย
64%
สีพื้นหลัง
0%
ใช้โดยอินเทอร์เฟซเบราว์เซอร์และ PWA manifest
เว็บไซต์ของคุณ
example.com
บุ๊กมาร์ก · 32px
Apple touch · 180px
PWA · 512px

แพ็กเกจ favicon ของคุณพร้อมแล้ว
การดาวน์โหลด ZIP เริ่มขึ้นแล้ว แตกไฟล์ลงใน root ของเว็บไซต์ และวางโค้ด HTML ใน <head> ของคุณ

เกี่ยวกับ เครื่องสร้าง Favicon

Favicon Generator สร้างไอคอนทุกแบบที่เว็บไซต์สมัยใหม่ต้องการจากแหล่งเดียว: อัปโหลดโลโก้ PNG เลือกไอคอนแบบฟอนต์ หรือพิมพ์ตัวอักษรย่อ ชุดผลลัพธ์รวมถึง favicon.ico แบบคลาสสิก (16, 32 และ 48 พิกเซล) favicon แบบ PNG สมัยใหม่ ไอคอน Apple touch ขนาด 180 พิกเซล ไอคอน PWA ขนาด 192 และ 512 พิกเซล ไฟล์ site.webmanifest และโค้ดสนิปเพ็ต HTML สำหรับส่วนหัว

การจัดสไตล์ทำได้ในเครื่องมือเลย: เลือกสีพื้นหลังหรือคงความโปร่งใส ตัดเป็นทรงสี่เหลี่ยม มุมโค้ง หรือวงกลม ปรับแพดดิ้งและขนาดผลงาน และกำหนดสีธีมที่ใช้โดย UI ของเบราว์เซอร์และแมนิเฟสต์ PWA พรีวิวแบบเรียลไทม์แสดงไอคอนของคุณในบริบทจริง — แท็บเบราว์เซอร์ขนาด 16 พิกเซล บุ๊กมาร์ก ไทล์ Apple touch และไอคอน PWA

ทุกอย่างเรนเดอร์บนแคนวาสในเบราว์เซอร์ของคุณ และ Generate จะรวบรวมแพ็กเกจทั้งหมดเป็นไฟล์ ZIP พร้อม README การติดตั้งมีเพียงสองขั้นตอน: แตกไฟล์ ZIP ไปยังโฟลเดอร์รากของเว็บไซต์ และวางสนิปเพ็ตที่ให้มาลงใน <head> ของคุณ

วิธีใช้ เครื่องสร้าง Favicon

  1. เลือกแหล่งที่มาของคุณ: อัปโหลดโลโก้ PNG เลือกไอคอนแบบฟอนต์ หรือพิมพ์ตัวอักษรย่อ
  2. จัดสไตล์ — สีพื้นหลังหรือความโปร่งใส รูปทรง แพดดิ้ง และขนาดผลงาน
  3. กรอกชื่อเว็บไซต์ ชื่อย่อ และสีธีมสำหรับแมนิเฟสต์ PWA
  4. ตรวจสอบพรีวิว: แท็บเบราว์เซอร์ บุ๊กมาร์ก Apple touch และบริบท PWA
  5. คลิก "Generate favicons" แล้วแตกไฟล์แพ็กเกจไปยังโฟลเดอร์รากของเว็บไซต์
  6. วางโค้ดสนิปเพ็ต HTML จากแพ็กเกจลงใน <head> ของหน้าเว็บของคุณ

คำถามที่พบบ่อย

ใช่ — แพ็กเกจแบบครบชุด รวมถึงไฟล์ .ico ทุกขนาด PNG แมนิเฟสต์ และโค้ดสนิปเพ็ต HTML ฟรีทั้งการสร้างและการดาวน์โหลด

favicon.ico ที่มีเลเยอร์ 16, 32 และ 48 พิกเซล favicon แบบ PNG สมัยใหม่ apple-touch-icon ขนาด 180 พิกเซล ไอคอน PWA ขนาด 192 และ 512 พิกเซล ไฟล์ site.webmanifest โค้ดสนิปเพ็ต HTML พร้อมวางใช้ และไฟล์ README พร้อมขั้นตอนการติดตั้ง

ใช่ เบราว์เซอร์และโปรแกรมเก็บข้อมูลยังคงเรียกไฟล์ /favicon.ico เป็นตัวสำรอง และไคลเอนต์รุ่นเก่ายังพึ่งพาไฟล์นี้อยู่ แพ็กเกจนี้จัดเตรียมไว้ให้พร้อมกับลิงก์ PNG สมัยใหม่ เพื่อให้ผู้เข้าชมทุกคนได้รับไอคอนที่คมชัด

แตกไฟล์เก็บถาวรไปยังโฟลเดอร์รากของเว็บไซต์เพื่อให้ไฟล์อยู่ที่รากของโดเมน จากนั้นวางโค้ดสนิปเพ็ต HTML ที่ให้มาลงใน <head> ของหน้าเว็บของคุณ ไฟล์ README ในไฟล์ ZIP อธิบายขั้นตอนเหล่านี้ซ้ำอีกครั้ง

ถูกเขียนลงในแมนิเฟสต์และแท็ก meta เพื่อทาสี UI ของเบราว์เซอร์บนมือถือ และหน้าจอเปิดตัวกับแถบชื่อของ PWA ที่ติดตั้งให้ตรงกับแบรนด์ของคุณ

ได้ พิมพ์ตัวอักษรย่อหนึ่งหรือสองตัวแล้วเลือกแบบตัวอักษรและสี หรือเลือกกลิฟจากคลังไอคอนแบบฟอนต์ — ตัวสร้างจะเรนเดอร์ให้ในทุกขนาดเหมือนกับโลโก้ที่อัปโหลด

แชร์สิ่งนี้

การค้นหายอดนิยม
เครื่องสร้าง favicon ตัวสร้าง favicon.ico สร้าง favicon ออนไลน์ apple touch icon เครื่องสร้างไอคอน PWA favicon จากโลโก้
ต้องการความช่วยเหลือ?
พบปัญหากับเครื่องมือนี้หรือไม่? แจ้งทีมงานของเรา
รายงานปัญหา

เพิ่มเครื่องมือฟรีนี้ลงในเว็บไซต์ของคุณเอง — คัดลอกและวางโค้ดด้านล่าง