ตัวสร้าง Favicon
ตัวสร้าง favicon ฟรี: สร้าง favicon.ico ไอคอน PNG, apple-touch-icon และ web manifest จากรูปภาพ SVG หรือข้อความและอีโมจิ ในเบราว์เซอร์ของคุณ
ใช้ทำอะไร
Favicon คือไอคอนเล็ก ๆ ที่เบราว์เซอร์แสดงบนแท็บ ในบุ๊กมาร์ก และในประวัติการเข้าชม โทรศัพท์ก็ใช้ไอคอนนี้เมื่อมีคนเพิ่มเว็บไซต์ของคุณลงในหน้าจอโฮม ตัวสร้างนี้สร้างทุกไฟล์ที่เว็บไซต์ต้องใช้จากภาพเดียว โลโก้ SVG หรือตัวอักษรไม่กี่ตัวหรืออีโมจิ ได้แก่ favicon.ico ที่มีภาพขนาด 16, 32 และ 48 พิกเซล ไอคอน PNG ขนาด 16, 32, 192 และ 512 พิกเซล apple-touch-icon ขนาด 180 พิกเซล web manifest และแท็ก HTML สำหรับวางในหน้าของคุณ
วิธีใช้
- เลือกรูปภาพหรือ SVG หรือพิมพ์ตัวอักษรหนึ่งหรือสองตัว หรืออีโมจิ
- ปรับรูปทรง พื้นหลัง และระยะขอบ โดยดูตัวอย่างไปด้วย
- ดาวน์โหลด ZIP วางไฟล์ไว้ที่รูทของเว็บไซต์ แล้ววาง HTML ใน <head>
คำถามที่พบบ่อย
ฉันต้องใช้ไฟล์อะไรบ้างจริง ๆ
favicon.ico ที่รูทของเว็บไซต์ครอบคลุมทุกเบราว์เซอร์ apple-touch-icon.png ขนาด 180 พิกเซลคือสิ่งที่ iPhone และ iPad แสดงบนหน้าจอโฮม ส่วน PNG ขนาด 192 และ 512 พิกเซลพร้อม web manifest คือสิ่งที่ Android ใช้ ไฟล์ ZIP มีครบทุกไฟล์
ทำไม Apple touch icon จึงมีพื้นหลัง
iOS เติมสีดำในส่วนโปร่งใสของ touch icon และทำให้มุมมนเอง ไอคอนนั้นจึงเป็นสี่เหลี่ยมจัตุรัสและทึบเสมอ โดยมีสีขาวอยู่ด้านหลังเมื่อคุณเลือกพื้นหลังโปร่งใส
รูปภาพแบบไหนดีที่สุด
โลโก้หรือสัญลักษณ์สี่เหลี่ยมจัตุรัสที่มีรายละเอียดน้อย ขนาดอย่างน้อย 512 พิกเซลหรือเป็น SVG ข้อความและเส้นบางจะหายไปที่ 16 พิกเซล ดูตัวอย่างขนาด 16 และ 32 พิกเซล และใช้ระยะขอบหากรูปทรงชนขอบ
favicon ใหม่ของฉันไม่แสดง ทำไม
เบราว์เซอร์เก็บ favicon ไว้ในแคชนานมาก เปิด favicon.ico โดยตรงในเบราว์เซอร์ รีโหลด หรือทดสอบในหน้าต่างส่วนตัว เสิร์ชเอนจินอาจใช้เวลาหลายวันหรือหลายสัปดาห์กว่าจะแสดงไอคอนใหม่
รูปภาพของฉันถูกอัปโหลดหรือไม่
ไม่ ไอคอนถูกวาดและไฟล์ถูกสร้างในเบราว์เซอร์ของคุณ ไม่มีอะไรถูกส่งไปยังเซิร์ฟเวอร์
⭐ แปลง PNG เป็น ICO
🖼 แปลง SVG เป็น PNG
📐 เครื่องมือปรับขนาดภาพ