window.addEventListener(‘message’, function (event) {
if (!event.data || event.data.type !== ‘resize’) return;
const iframe = document.getElementById(‘lovable-frame’);
if (iframe && typeof event.data.height === “number”) {
iframe.style.height = event.data.height + “px”;
}
});
ทำไมต้องแปลง PNG เป็น ICO?
ไฟล์ ICO (ไอคอน) เป็นไฟล์ที่จำเป็นสำหรับการสร้าง ไอคอนเว็บไซต์, ไอคอนเดสก์ท็อปของ Windows, และ ไอคอนแอปพลิเคชัน ในขณะที่ PNG เหมาะสำหรับการแสดงภาพที่มีความโปร่งใสและคุณภาพสูง แต่เบราว์เซอร์และระบบส่วนใหญ่ยังคงต้องการไฟล์ ICO สำหรับการแสดงไอคอนขนาดเล็ก
การแปลง PNG เป็น ICO จะทำให้ไอคอนของคุณเข้ากันได้กับเบราว์เซอร์ที่สำคัญทั้งหมด ระบบ Windows และแอปพลิเคชันแลนช์ — ในขณะที่ยังคงรักษาคุณภาพและความโปร่งใสของภาพ
ข้อดีของการใช้ไฟล์ ICO
-
✅ พร้อมสำหรับใช้เป็นไอคอนเว็บไซต์ – เพิ่มไอคอนไปยังแท็บเว็บไซต์ บุ๊คมาร์ก หรือแมนิเฟสต์ PWA ได้อย่างง่ายดาย
-
✅ รองรับหลายขนาด – ไฟล์ ICO สามารถมีหลายขนาด (16×16, 32×32, 64×64, ฯลฯ) สำหรับการปรับขนาดที่ตอบสนอง
-
✅ เหมาะสำหรับไอคอน Windows – เข้ากันได้กับไอคอนเดสก์ท็อปและไอคอนไฟล์ EXE
วิธีการใช้เครื่องมือนี้
-
อัปโหลดไฟล์ PNG ของคุณ
คลิก “เลือกไฟล์ PNG” หรือลากและวางภาพของคุณลงในกล่องอัปโหลดด้านบน -
การแปลงอัตโนมัติ
เครื่องมือนี้แปลงภาพ PNG ของคุณเป็นไฟล์ ICO ในขณะที่ยังคงรักษาความโปร่งใส -
ดาวน์โหลด ICO
คลิกปุ่ม ดาวน์โหลด ICO เพื่อประหยัดไฟล์ไอคอนใหม่ของคุณ -
ใช้ที่ไหนก็ได้
เพิ่มไอคอน ICO ของคุณไปยังเว็บไซต์เป็นไอคอนเว็บไซต์ หรือใช้ในแอปพลิเคชันเดสก์ท็อปหรือซอฟต์แวร์ของคุณ
คำถามที่พบบ่อย
ไฟล์ ICO จะรองรับความโปร่งใสหรือไม่?
ใช่ เครื่องมือนี้ยังคงรักษาความโปร่งใสของ PNG ในไฟล์ ICO ออกพุต ทำให้เหมาะสำหรับไอคอนที่มีคุณภาพสูงและสะอาด
ฉันสามารถใช้ไอคอน ICO นี้เป็นไอคอนเว็บไซต์ได้หรือไม่?
ใช่ เพียงอัปโหลดไอคอน ICO ไปยังไดเร็กทอรีรูทและเชื่อมโยงไปยัง <head> ของไซต์ของคุณโดยใช้ <link rel="icon" href="/favicon.ico">
เครื่องมือนี้ฟรีและปลอดภัยหรือไม่?
ใช่ เป็นเครื่องมือฟรี 100% ที่ใช้บนเบราว์เซอร์และปลอดภัย — ไม่มีการจัดเก็บไฟล์และไม่ต้องติดตั้ง
ฉันสามารถแปลงเป็นรูปแบบภาพอื่นได้หรือไม่?
ใช่ เลือกรูปแบบไฟล์จากด้านล่าง
.conversion-footer {
font-family: system-ui, sans-serif;
margin: 30px 0;
}
details.convert-dropdown {
margin-bottom: 8px;
border: 1px solid #e0e0e0;
border-radius: 6px;
background-color: #fff;
transition: box-shadow 0.3s;
}
details.convert-dropdown[open] {
box-shadow: 0 2px 8px rgba(0,0,0,0.04);
}
.convert-dropdown summary {
font-weight: 600;
font-size: 15px;
padding: 12px 16px;
background-color: #f7f8f9;
border-bottom: 1px solid #e0e0e0;
cursor: pointer;
list-style: none;
position: relative;
}
.convert-dropdown summary:hover {
background-color: #eef0f2;
}
.convert-dropdown summary::marker {
display: none;
}
.convert-dropdown summary::after {
content: “▾”;
position: absolute;
right: 16px;
font-size: 12px;
transition: transform 0.3s ease;
}
details[open] summary::after {
transform: rotate(180deg);
}
.convert-dropdown a {
display: block;
padding: 10px 20px;
text-decoration: none;
color: #0073aa;
font-size: 14px;
border-top: 1px solid #f1f1f1;
transition: background 0.2s;
}
.convert-dropdown a:hover {
background-color: #f1f7fb;
color: #005177;
}
