วิธีสร้างไอคอนแอป Windows

Windows UI ปรับขนาดบริบทที่ใช้งานจากสัญลักษณ์พื้นที่การแจ้งเตือน 16×16 เป็นพินขนาดจัมโบ้ 256×256 บนทาสก์บาร์ DPI สูง บิตแมปหนึ่งอันที่ทอดข้ามช่วงนั้นดูนุ่มนวลหรือเป็นพิกเซล

มีคอนเทนเนอร์ .ico ดังนั้นไฟล์เดียวจึงมีเฟรมที่แสดงผลล่วงหน้าหลายเฟรม Shell32 เลือกขนาดที่ใกล้เคียงที่สุดแทนที่จะขยายขนาดภาพเล็ก ๆ

ไอคอนเว็บ favicon และแอปเดสก์ท็อปใช้รูปแบบคอนเทนเนอร์เดียวกัน ทักษะที่ถ่ายโอนระหว่างการใช้งาน favicon.ico และการบรรจุไฟล์ปฏิบัติการ Win32 หรือ Electron

Use our favicon generator, PNG to ICO converter, SVG to ICO converter, and live favicon tester to build and verify your icon set, and read the companion guide for a condensed walkthrough.

Microsoft แนะนำให้ฝังสี่เหลี่ยมขนาด 16, 24, 32, 48, 64, 128 และ 256 พิกเซลใน .ico เดียวสำหรับแอปสมัยใหม่

16 และ 24 ครอบคลุมรายการเชลล์ขนาดเล็ก 32 และ 48 ครอบคลุมมุมมองไอคอนมาตรฐานและขนาดกลางใน File Explorer เวอร์ชัน 64 และสูงกว่าจะครอบคลุมภาพย่อ DPI สูงและไทล์เมนู Start

การละเว้น 256 ไม่ได้ทำให้สิ่งใดเสียหายเสมอไป แต่ไทล์ที่ปักหมุดไว้บนจอภาพ 4K จะดูนุ่มนวลขึ้นอย่างเห็นได้ชัดหากไม่มีมัน

เครื่องมือรุ่นเก่าจัดเก็บ 256×256 เป็น BMP 32 บิตที่ไม่มีการบีบอัดภายใน .ico เฟรมเดียวนั้นสามารถเกิน 256KB และตัวติดตั้งขยายได้

ตัวเข้ารหัสสมัยใหม่จัดเก็บเฟรมขนาดใหญ่เป็น blobs ที่บีบอัด PNG ภายในคอนเทนเนอร์ ICO คุณภาพของภาพยังคงเหมือนเดิม ขนาดไบต์ลดลง 5–10 ×

ตรวจสอบขนาด .ico สุดท้ายเสมอ ขนาดต่ำกว่า 50KB เป็นเรื่องปกติสำหรับโลโก้แบนที่มีการบีบอัด PNG; มากกว่า 200KB ส่งสัญญาณการขยายตัวของ BMP

FetchFavicon ยอมรับต้นแบบ 512×512 และปล่อย .ico ที่พร้อมใช้งานบนเว็บด้วยเฟรมขนาดใหญ่ที่บีบอัด PNG ซึ่งเหมาะสำหรับการฝังทรัพยากร Electron, Tauri และ Win32 แบบคลาสสิก

ตัวแก้ไขทรัพยากรของ Visual Studio ตรวจสอบโครงสร้าง ICO เมื่อคุณคอมไพล์แอปเนทิฟ ทดสอบที่นั่นก่อนเผยแพร่ MSI

หลีกเลี่ยงการเปลี่ยนชื่อ PNG เดียวเป็น .ico Windows Explorer อาจแสดงตัวอย่าง แต่การปรับขนาดเชลล์จะได้รับผลกระทบ

แอปอิเล็กตรอน: วาง favicon.ico ในทรัพยากรการสร้าง ตั้งค่า win.icon ใน electronic-builder.yml เป็นไฟล์หลายขนาดเดียวกัน

โปรแกรมติดตั้งการตั้งค่า Inno: SetupIconFile=assets\app.ico ต้องชี้ไปที่ .ico ที่มีอย่างน้อย 32 และ 48 เฟรม

การแจกจ่าย ZIP แบบพกพา: ผู้ใช้ปักหมุด .exe ของคุณไว้ที่ทาสก์บาร์ Windows อ่านทรัพยากรไอคอนแบบฝังจากส่วนหัว PE ซึ่งคุณคอมไพล์จากต้นแบบ .ico เดียวกัน

Corporate MSI: ลงชื่อตัวติดตั้งหลังจากฝังไอคอน — การเปลี่ยน .ico หลังการลงนามจะทำให้ลายเซ็นเป็นโมฆะ

.ico เหมือนกันบนเว็บและเดสก์ท็อปหรือไม่ ข้อมูลจำเพาะของคอนเทนเนอร์เดียวกัน แอปเดสก์ท็อปฝังไว้เป็นทรัพยากร PE แทนที่จะให้บริการผ่าน HTTP

ฉันจำเป็นต้องมีไอคอนแยกต่างหากสำหรับเวอร์ชัน Windows หรือไม่ .ico หลายขนาดสมัยใหม่หนึ่งอันครอบคลุม Windows 10 และ 11

แล้ว .ico กับ .png สำหรับ UWP ล่ะ UWP ใช้สินทรัพย์ PNG ในรายการแพ็คเกจ classic Win32 ยังคงต้องการ .ico

ฉันสามารถแยกขนาดจาก .ico ที่มีอยู่ได้หรือไม่ ใช่ด้วยการแปลง IcoFX หรือ ImageMagick สำหรับการตรวจสอบ

ไอคอนไม่ชัดบนทาสก์บาร์: ขาดหายไป 32 หรือ 48 เฟรม; Windows อัปเกรดเป็น 16 แทน

ไอคอนตัวติดตั้งผิด แต่ไอคอน exe ถูกต้อง: Inno Setup IconFile ยังคงชี้ไปที่เส้นทางเก่า สร้างตัวติดตั้งใหม่

คอมไพล์ขนาดใหญ่คอมมิตหลังจากเพิ่มไอคอน: คุณคอมมิตสไตล์ BMP .ico ส่งออกอีกครั้งด้วยการบีบอัด PNG

ไอคอนแสดงบนเครื่อง dev เท่านั้น: ทรัพยากรไม่ได้ฝังอยู่ในการกำหนดค่า Release build — ตรวจสอบไฟล์ .rc และ CI artifact

แอพดั้งเดิมของ Win32 อ้างอิง .ico ในสคริปต์ทรัพยากร .rc ที่คอมไพล์เป็นไฟล์ PE รหัสทรัพยากร 1 คือไอคอนแอปพลิเคชันเริ่มต้น

แพ็คเกจอิเล็กตรอนอ่าน win.icon จากการกำหนดค่าตัวสร้างอิเล็กตรอน .ico หลายขนาดเดียวกันจะถูกแตกออกมาเป็น .exe สุดท้าย

Tauri บน Windows คาดหวัง .ico ใน tauri.conf.json Bundle.icon อาร์เรย์ควบคู่ไปกับ PNG สำหรับแพลตฟอร์มอื่น ๆ

การลงนามโค้ดไม่ได้ตรวจสอบพิกเซลของไอคอน แต่การเปลี่ยนแปลงทรัพยากรหลังจากการลงนามจะทำให้ลายเซ็นแตก — ทำการสรุปไอคอนก่อนการลงนาม Authenticode

ทดสอบ .exe ที่คอมไพล์แล้วบน VM ใหม่ทั้งหมดโดยไม่ต้องติดตั้งเครื่องมือ dev Explorer อ่านทรัพยากรที่ฝังไว้ ไม่ใช่เส้นทาง repo แหล่งที่มาของคุณ

มุมมองไอคอนขนาดเล็กใน Explorer รองรับเฟรม 16 และ 32 พิกเซล ไอคอนขนาดใหญ่พิเศษใช้ 256 เมื่อมี

การตรึงแถบงานร้องขอเฟรมขนาดกลาง หายไป 32 ให้ระดับที่นุ่มนวลจาก 16

ไทล์เมนูเริ่มบน Windows 11 เคลื่อนไหวด้วยเนื้อหาที่มีความละเอียดสูงกว่าเมื่อฝังขนาด 256×256

ไฟล์ทางลัด .lnk บนเดสก์ท็อปอาจแคชไอคอนแยกกัน — ลบและสร้างทางลัดใหม่หลังจากอัปเดต .ico ที่เกี่ยวข้องระหว่าง QA

ทดสอบสเกลการแสดงผล 100% และ 200% บน Windows 11. แต่ละสเกลจะเลือกเฟรมที่แตกต่างจาก ICO เดียวกัน

ปักหมุดที่ทาสก์บาร์ เลิกปักหมุด ปักหมุดใหม่หลังจากอัปเดตไอคอนเพื่อล้างแคชเชลล์ระหว่าง QA

ตรวจสอบคุณสมบัติ → เปลี่ยนไอคอนบนทางลัดที่สร้างขึ้นก่อนการอัปเดต - อาจอ้างอิงดัชนีที่แคชไว้

เปรียบเทียบภาพขนาดย่อของ Explorer กับไอคอนแถบงาน — ความคลาดเคลื่อนบ่งชี้ว่าไม่มีเฟรมขนาดกลาง

ไอคอน MSI และ EXE ควรตรงกับเว็บไซต์ favicon ของคุณเพื่อความต่อเนื่องของแบรนด์เมื่อผู้ใช้ปักหมุดหลังการติดตั้ง

กล่องโต้ตอบตัวถอนการติดตั้งใช้ทรัพยากรไอคอนเดียวกัน — ผู้ใช้สังเกตเห็นความไม่ตรงกันระหว่างตัวติดตั้งและแอป

รายการร้านค้าสำหรับแพ็คเกจ Microsoft Store ใช้ข้อกำหนด PNG แยกต่างหาก เดสก์ท็อป ICO ยังคงเกี่ยวข้องกับ Win32 sideload

เก็บ ICO หลักหนึ่งรายการไว้ใน repo CI สร้างการคัดลอกลงในการตั้งค่าตัวติดตั้งและเว็บสาธารณะ / เพื่อหลีกเลี่ยงการดริฟท์

Windows SmartScreen ไม่ได้ตัดสินความสวยงามของไอคอน — แต่ผู้ใช้จะเชื่อถือไอคอนที่ตรงกันเมื่อยืนยันข้อความแจ้งการติดตั้ง

แอป macOS ต้องใช้ .icns แยกต่างหาก Windows ICO ไม่ได้แทนที่พวกมันในรุ่น Electron สากล

รายการเดสก์ท็อป Linux มักอ้างอิง PNG ที่ 512×512; สร้าง PNG จากต้นแบบเดียวกันกับ ICO

ไอคอนร้านค้าบนมือถือเป็นอีกหนึ่งชุดการส่งออก - จำเป็นต้องมีเครื่องมือเว็บ favicon แต่ไม่เพียงพอสำหรับร้านค้าแอป

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

บันทึกการเผยแพร่แท็กเมื่อทรัพยากรไอคอนเปลี่ยนแปลง เพื่อให้ฝ่ายสนับสนุนสามารถตอบได้ว่าทำไมทางลัดจึงดูแตกต่างออกไปหลังการอัปเดต

ตรวจสอบทรัพยากรที่ฝังตัว ICO ด้วย Resource Hacker หรือเทียบเท่า ก่อนที่จะลงนามไบนารีตัวติดตั้งขั้นสุดท้าย

เอกสารที่ ICO เฟรม Windows เลือกระหว่างการจับภาพหน้าจอ QA — ช่วยในการดีบักรายงานแถบงานที่ไม่ชัดเจน

เก็บเส้นทาง ICO ไว้ในตัวติดตั้ง YAML แสดงความคิดเห็นพร้อมกับรายการเฟรมที่คาดหวังภายในไฟล์