เครื่องมือทั้งหมด
เครื่องมือ SEO
เครื่องมือโฆษณา
เครื่องมือลิงก์
เครื่องมือโซเชียล
เครื่องมือข้อความ
เครื่องมือทั่วไป
เครื่องคำนวณการเงิน
ธุรกิจไทย
เครื่องมือรูปภาพ
สายมู เลขศาสตร์
บ้านและการใช้ชีวิต
การศึกษา
สุขภาพ

สร้าง Favicon PNG, ICO และ Apple Touch Icon

สร้าง favicon ทุกไฟล์ที่เว็บไซต์ต้องใช้จากรูปเพียงภาพเดียว เพียงอัปโหลดรูปสี่เหลี่ยมจัตุรัส เครื่องมือจะวาดไฟล์ PNG ขนาด 16, 32, 48, 64, 180, 192 และ 512 พิกเซล รวมไฟล์ favicon.ico แบบหลายขนาด และให้โค้ด HTML สำหรับวางในส่วน head ทุกอย่างทำงานในเบราว์เซอร์ด้วย Canvas API รูปของคุณจึงไม่ถูกอัปโหลดขึ้นเซิร์ฟเวอร์

รูปต้นฉบับ

ควรใช้รูปสี่เหลี่ยมจัตุรัสขนาดอย่างน้อย 512×512 เพื่อความคมชัด ทุกอย่างทำงานในเบราว์เซอร์ สูงสุด 25 MB

Favicon ของคุณจะแสดงที่นี่

อัปโหลดรูปเพื่อสร้าง favicon ทุกขนาด ไฟล์ favicon.ico และโค้ด HTML

วิธีใช้งาน

  1. อัปโหลดรูปสี่เหลี่ยมจัตุรัส (ควรมีขนาด 512×512 ขึ้นไป) โดยลากมาวาง คลิกเลือกไฟล์ หรือวางจากคลิปบอร์ด
  2. เลือกการปรับขนาดแบบพอดีหรือเต็ม และกำหนดสีพื้นหลัง หรือเลือกพื้นหลังโปร่งใส
  3. ดูตัวอย่างไอคอนทุกขนาดตั้งแต่ 16×16 จนถึง 512×512 รวมถึง apple-touch-icon และขนาดสำหรับ PWA
  4. ดาวน์โหลด PNG ทีละไฟล์ ดาวน์โหลดทุกไอคอนรวมเป็นไฟล์ ZIP เดียว หรือดาวน์โหลด favicon.ico แบบหลายขนาด
  5. คัดลอกโค้ด HTML แล้ววางไว้ในแท็ก <head> ของหน้าเว็บ

ฟีเจอร์เด่น

  • สร้าง favicon PNG ขนาด 16, 32, 48, 64, 180, 192 และ 512 พิกเซล
  • สร้างไฟล์ favicon.ico แบบหลายขนาด (16 / 32 / 48) ในเบราว์เซอร์จริง
  • มี apple-touch-icon และไอคอนสำหรับ PWA / Android Chrome
  • เลือกพื้นหลังโปร่งใสหรือกำหนดสีเอง พร้อมปรับขนาดแบบพอดีหรือเต็ม
  • โค้ด HTML แท็ก <link> และ manifest ที่คัดลอกไปใช้ได้ทันที
  • ทำงานในเบราว์เซอร์ 100% รูปของคุณไม่ออกจากอุปกรณ์

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

Favicon ต้องมีขนาดใดบ้าง?
เว็บไซต์ยุคใหม่ควรมี 16×16 และ 32×32 สำหรับแท็บเบราว์เซอร์, 48×48 สำหรับ Windows, apple-touch-icon 180×180 สำหรับ iOS และ 192×192 กับ 512×512 สำหรับ Android และการติดตั้ง PWA เครื่องมือนี้สร้างครบทุกขนาดพร้อมไอคอน 64×64 ในครั้งเดียว
favicon.ico คืออะไร ยังจำเป็นอยู่ไหม?
favicon.ico คือไฟล์เดียวที่รวมหลายขนาด (ในที่นี้คือ 16, 32 และ 48) เบราว์เซอร์รุ่นเก่าจะเรียกไฟล์นี้อัตโนมัติเมื่อวางไว้ที่รากของเว็บไซต์ จึงยังควรมีไว้เพื่อความเข้ากันได้สูงสุด เครื่องมือนี้จึงสร้างให้อัตโนมัติ
สร้าง favicon จากไฟล์ PNG หรือ JPG ได้ไหม?
ได้ อัปโหลดไฟล์ PNG, JPG, SVG หรือ WebP แล้วเครื่องมือจะวาดลงบนพื้นสี่เหลี่ยมจัตุรัสตามแต่ละขนาด รูปต้นฉบับสี่เหลี่ยมจัตุรัสขนาด 512×512 ขึ้นไปจะได้ผลคมชัดที่สุด ส่วนรูปที่ไม่เป็นสี่เหลี่ยมสามารถเลือกให้พอดีหรือครอปเต็มได้
วางไฟล์ favicon และโค้ด HTML ไว้ที่ไหน?
วางไฟล์ favicon.ico และไฟล์ PNG ไว้ที่รากของเว็บไซต์ แล้ววางแท็ก <link> ที่สร้างขึ้นไว้ในส่วน <head> ของ HTML หากเก็บไฟล์ไว้ในโฟลเดอร์ย่อยเช่น /assets/ ให้ปรับ path ให้ตรง
รูปของฉันถูกอัปโหลดที่ไหนไหม?
ไม่ ไอคอนทุกไฟล์ถูกสร้างในเครื่องด้วย Canvas API ภายในเบราว์เซอร์ รูปของคุณไม่ถูกส่งขึ้นเซิร์ฟเวอร์ ทำให้เครื่องมือทำงานเร็ว เป็นส่วนตัว และใช้งานแบบออฟไลน์ได้เมื่อโหลดหน้าแล้ว