สร้าง Favicon

Favicon เวอร์ชัน 2026 สร้าง favicon.ico สำหรับเบราว์เซอร์และไอคอนสำหรับมือถือจากรูปภาพ PNG โปร่งใสหรือรูปแบบอื่นๆ ได้พร้อมกันในครั้งเดียว ประมวลผลเสร็จสมบูรณ์ในเบราว์เซอร์ จึงปลอดภัย

ลากและวางรูปภาพที่นี่ หรือ
เลือกไฟล์

ตัวอย่างโค้ด HTML (กรุณาวางไว้ในแท็ก head)
            
<!-- ブラウザのUIカラーをOS設定に合わせる -->
<meta name="theme-color" content="#ffffff" media="(prefers-color-scheme: light)">
<meta name="theme-color" content="#000000" media="(prefers-color-scheme: dark)">

<!-- Favicon設定 -->
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
<link rel="manifest" href="/site.webmanifest">
<link rel="shortcut icon" href="/favicon.ico">
<meta name="msapplication-TileColor" content="#ffffff">

※กรุณาแตกไฟล์ ZIP ที่ดาวน์โหลดแล้วอัปโหลดไฟล์ทั้งหมดไปยังโฟลเดอร์เดียวกับ index.php

การประมวลผลฝั่งไคลเอนต์ขั้นสูง

เครื่องมือนี้ใช้ Canvas API และ JSZip ในการตรวจสอบรูปภาพ ปรับขนาด และบีบอัด ZIP ทั้งหมดเสร็จสมบูรณ์ภายในเบราว์เซอร์ ปลอดภัยเนื่องจากไม่มีการส่งข้อมูลรูปภาพไปยังเซิร์ฟเวอร์ และยังสร้าง webmanifest ที่รองรับ PWA ให้โดยอัตโนมัติ

กลไกการทำงานและเทคโนโลยีที่ใช้

  1. ใช้ FileReader API เพื่อโหลดรูปภาพที่เลือกหรือลากวางอย่างปลอดภัยในเครื่องของคุณ
  2. ใช้ Canvas API (บริบท 2D) เพื่อปรับขนาดรูปภาพให้เหมาะสมกับอุปกรณ์ PC, iOS และ Android พร้อมกันในครั้งเดียว
  3. ใช้ JSZip เพื่อรวมไฟล์ PNG ที่สร้างขึ้นหลายไฟล์และ site.webmanifest ที่สร้างแบบไดนามิกเป็นไฟล์ ZIP ในหน่วยความจำ
  4. หลังจากตัดพอยท์แบบอะซิงโครนัสผ่าน API เสร็จสิ้น ระบบจะดาวน์โหลด ZIP ที่บรรจุไฟล์ไว้ทันทีและแสดงโค้ด HTML สำหรับใส่ใน head

เรายังมีเครื่องมืออื่นๆ ที่เป็นประโยชน์

แนะนำเครื่องมือนี้ให้เพื่อน

🛠️ IVYWE企画開発のPortalサイトとおすすめサービス