เครื่องมือ95

สร้างสรรค์ผลงานที่ยอดเยี่ยม

เครื่องมือสร้าง Favicon / ICO.

สร้าง favicon จากรูปภาพหรือข้อความ ดูตัวอย่างแท็บเบราว์เซอร์ ใช้ฟอนต์ระบบ และดาวน์โหลด ICO หลายขนาด หรือไฟล์ ZIP ของไอคอนสำหรับเว็บไซต์, Apple และ Android

โฆษณา
พื้นที่ทำงานรูปภาพของคุณ
บนอุปกรณ์ของคุณ
หรือลากและวางที่นี่
PNG, JPG, JPEG, WEBP, GIF
เลือรูปภาพของคุณเพื่อเริ่มต้นรูปภาพ
โฆษณา
บล็อก วิธีสร้าง Favicon อ่านคู่มือ

สร้างไอคอนเว็บไซต์ (favicon) ที่ยังคงความชัดเจนในทุกขนาด

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

เครื่องหมายที่ชัดเจนเพียงหนึ่งเดียวจะกลายเป็นไอคอนเบราว์เซอร์ บุ๊กมาร์ก และเว็บไซต์บนมือถือ
วิดีโอสอนการใช้งานฉบับย่อ How to create a favicon and website icon package Choose an image, preview browser icons, set the website package and download all icon files in one ZIP. เสียงบรรยายภาษาอังกฤษ ดูวิดีโอ

How to create a favicon and website icon package

คุณสมบัติและการควบคุม

เริ่มต้นด้วยรูปภาพหรือตัวอักษรย่อของคุณ

อัปโหลดรูปภาพ หรือเลือกข้อความในหน้าเครื่องมือ

อินพุตรูปภาพและข้อความ

รูปภาพรองรับ PNG, JPG, JPEG, WebP หรือ GIF ข้อความจะเปิดโปรแกรมแก้ไขเดียวกันพร้อมตัวอักษรของคุณที่พร้อมสำหรับการจัดรูปแบบ 'สร้างจาก' ช่วยให้คุณสลับระหว่างรูปภาพที่อัปโหลดและอักษรย่อได้ ใช้ตัวอักษรหนึ่งหรือสองตัวที่เรียบง่ายเพื่อให้ได้ผลลัพธ์ที่ชัดเจนที่สุดที่ 16 พิกเซล อินพุต GIF จะใช้เฟรมภาพนิ่ง ผลลัพธ์ที่ได้จะไม่เป็นภาพเคลื่อนไหว

ประเมินไอคอนในจุดที่จะปรากฏ

ตัวอย่างเบราว์เซอร์แบบสว่างและมืดจะแสดงไอคอนเดียวกันบนพื้นผิวที่แตกต่างกัน

ตัวอย่างขนาดจริง

โปรแกรมแก้ไขจะแสดงตัวอย่างแท็บเบราว์เซอร์ขนาด 16 พิกเซล, ไอคอนขนาด 16, 32 และ 48 พิกเซลแยกต่างหาก และตัวอย่าง Apple Touch ไอคอนขนาดเล็กจะเผยให้เห็นรายละเอียดที่หายไปเมื่อโลโก้ขนาดใหญ่ถูกย่อลง ทำให้แหล่งที่มาเรียบง่ายขึ้นหรือเพิ่มพื้นที่รอบๆ จนกว่าตัวอย่างที่เล็กที่สุดจะสามารถจดจำได้ รูปภาพ Apple Touch จะแสดงในขนาดที่เล็กกว่าขนาด 180 พิกเซลที่ส่งออก

สร้างภาพเงาที่ชัดเจนให้กับงานศิลปะของคุณ

เลือกสี่เหลี่ยมมุมมน สี่เหลี่ยม หรือวงกลม และปรับพื้นที่รอบเนื้อหา

ความพอดี ระยะห่าง และความโปร่งใส

'แสดงรูปภาพทั้งหมด' จะเก็บขอบต้นฉบับทั้งหมดไว้ภายในไอคอน 'เติมไอคอน' จะครอบคลุมพื้นที่ที่มีอยู่และอาจตัดขอบออก 'พื้นที่รอบเนื้อหา' จะปรับระยะห่างจาก 0 ถึง 35 เปอร์เซ็นต์ เลือกพื้นหลังหรือเปิดใช้งานพื้นหลังโปร่งใส พิกเซลโปร่งใสนอกภาพเงาทรงกลมหรือมุมมนจะยังคงความชัดเจนไว้ วิธีนี้จะไม่ลบพื้นหลังทึบที่มีอยู่แล้วในรูปภาพที่คุณอัปโหลด

สร้างอักษรย่อที่โดดเด่น

ตั้งค่าตัวอักษร แบบอักษร และสีที่ตัดกัน

การจัดรูปแบบข้อความ

ข้อความ / อักษรย่อรองรับตัวอักษรสูงสุดสามตัวพร้อมรูปแบบ Modern sans, Classic serif และ Monospace ที่รวมอยู่ ในเบราว์เซอร์เดสก์ท็อปที่รองรับ ให้เลือก 'ใช้แบบอักษรของระบบ' และอนุญาตการเข้าถึงแบบอักษรเพื่อเติมรายการแบบอักษรด้วยตระกูลแบบอักษรที่ติดตั้งบนอุปกรณ์ของคุณ เลือกตระกูลเพื่ออัปเดตตัวอย่างสด หรือใช้ลูกศรย้อนกลับและถัดไปเพื่อเปรียบเทียบแบบอักษรข้างเคียง ชื่อและไฟล์แบบอักษรจะไม่ถูกอัปโหลด ข้อความจะพอดีกับพื้นที่ที่มีอยู่โดยอัตโนมัติ ดูตัวอย่างขนาดไอคอนที่เล็กที่สุดหลังจากเปลี่ยนแบบอักษรหรือสี

เลือก ICO หรือแพ็คเกจเว็บไซต์ที่สมบูรณ์

การดำเนินการเริ่มต้นหนึ่งครั้งจะสร้างการดาวน์โหลดที่เลือก

ไฟล์และขนาด

ไฟล์ ICO หลายขนาดประกอบด้วยภาพขนาด 16, 24, 32, 48, 64, 128 และ 256 พิกเซลในไฟล์เดียว favicon.ico แพ็กเกจไอคอนเว็บไซต์จะสร้างไฟล์ ZIP หนึ่งไฟล์ที่ประกอบด้วย ICO, PNG ไอคอนที่ขนาด 16, 32 และ 48 พิกเซล, ไอคอน Apple Touch ที่ขนาด 180 พิกเซล, ไอคอน Android ที่ขนาด 192 และ 512 พิกเซล, เว็บไซต์ manifest และ INSTALL.txt ชื่อเว็บไซต์จะใช้เป็นชื่อใน manifest

ติดตั้งไอคอนบนเว็บไซต์ของคุณ

ไฟล์ ZIP ประกอบด้วยแท็กลิงก์ HTML และชื่อไฟล์ที่ตรงกัน

การใช้ไฟล์ติดตั้ง

อัปโหลดเนื้อหาในแพ็กเกจไปยังรูทของเว็บไซต์และคัดลอกแท็กลิงก์จาก INSTALL.txt ไปไว้ในส่วนหัวของหน้าเว็บ หากคุณเก็บไอคอนไว้ในโฟลเดอร์ย่อย ให้ปรับปรุงเส้นทาง HTML และเส้นทางภายใน site.webmanifest ล้างแคชของ favicon หรือทดสอบในแท็บใหม่เมื่อตรวจสอบการอัปเดต manifest ที่สร้างขึ้นเป็นการกำหนดค่าไอคอน ไม่ใช่การติดตั้ง Progressive Web App แบบเต็มรูปแบบ

ไฟล์และการประมวลผล

อินพุต
PNG, JPG, JPEG, WebP, GIF หรือตัวอักษรย่อ
เอาต์พุต
ICO หลายขนาด หรือไฟล์ ZIP ของไอคอนเว็บไซต์และไฟล์ติดตั้ง

ขนาดสูงสุดต่อไฟล์ 25 MB หนึ่งไฟล์ต่อการทำงาน

ภาพหนึ่งภาพขนาดสูงสุด 25 MB พร้อมความละเอียดสูงสุด 60 ล้านพิกเซล และ 16,000 พิกเซลต่อด้าน ขนาด ICO มีตั้งแต่ 16 ถึง 256 พิกเซล PNG ที่ใหญ่ที่สุดที่บรรจุไว้คือ 512 × 512 พิกเซล

การสร้างไอคอนและการแสดงตัวอย่างจะทำงานบนอุปกรณ์ของคุณ เครื่องมือนี้ไม่ได้อัปโหลดภาพที่เลือกเพื่อทำการแปลง

เครื่องมือนี้ประมวลผลและส่งออกไฟล์ในเบราว์เซอร์ของคุณ รูปภาพที่ดาวน์โหลดเป็นไฟล์แยกต่างหาก ต้นฉบับในอุปกรณ์ของคุณจะไม่ถูกเขียนทับ

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

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

ข้อมูลที่ควรรู้

คำตอบบางส่วนก่อนที่คุณจะเริ่มต้น

บนอุปกรณ์ของคุณ
ฉันสามารถสร้าง favicon โดยไม่ต้องอัปโหลดโลโก้ได้หรือไม่

ได้ เลือกข้อความ ป้อนตัวอักษรย่อของคุณ จากนั้นเลือกแบบอักษร สี รูปร่าง และระยะห่างในตัวแก้ไข

มีขนาดใดบ้างภายในไฟล์ ICO

ICO ประกอบด้วยเฟรมขนาด PNG จำนวนเจ็ดเฟรม ได้แก่ 16, 24, 32, 48, 64, 128 และ 256 พิกเซลแบบจัตุรัส เบราว์เซอร์จะเลือกเฟรมที่เหมาะสม

มีอะไรบ้างในไฟล์ ZIP ของเว็บไซต์

ประกอบด้วย favicon.ico, ไอคอน PNG หกรายการสำหรับเบราว์เซอร์, Apple และ Android, site.webmanifest และ INSTALL.txt พร้อมแท็กลิงก์ HTML

favicon ของฉันสามารถมีพื้นหลังโปร่งใสได้หรือไม่

ได้ เปิดใช้งานพื้นหลังโปร่งใส ซึ่งจะคงพื้นที่โปร่งใสรอบๆ แหล่งข้อมูลไว้ โดยจะไม่ลบพื้นหลังทึบออกจากภาพถ่าย

ภาพถูกอัปโหลดเพื่อทำการแปลงหรือไม่

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

ฉันสามารถใช้แบบอักษรที่ติดตั้งบนคอมพิวเตอร์ของฉันได้หรือไม่

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

โฆษณา

ภาษา38

English العربية Français Italiano Deutsch Español Português Nederlands Русский Türkçe 日本語 中文 हिन्दी Bahasa Indonesia Bahasa Melayu 한국어 Tiếng Việt ไทย Polski Svenska Українська Norsk বাংলা Ελληνικά فارسی اردو Čeština Dansk Magyar Română Suomi Български Filipino ქართული Slovenčina Azərbaycanca עברית Slovenščina

เลือกภาษาของคุณ วิดีโอสอนการใช้งานปัจจุบันใช้การบรรยายเป็นภาษาอังกฤษ