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”;
}
});

لماذا تحويل WebP إلى PNG؟

WebP هو تنسيق صورة حديث يتميز بالضغط الممتاز، ولكن ليس جميع البرامج أو المنصات أو المحررات تدعمه بشكل كامل بعد. PNG، من ناحية أخرى، هو تنسيق صورة عالمي يدعم الشفافية ويتم قبوله على جميع المتصفحات وأدوات الجرافيك والأجهزة.

تحويل WebP إلى PNG يضمن التوافق الأقصى، خاصة إذا كنت بحاجة إلى تحرير الصورة أو الحفاظ على الشفافية أو استخدامها في الأنظمة القديمة وعمليات التصميم.

الفوائد الرئيسية لاستخدام تنسيق PNG

• ✅ الضغط الخالي من الخسارة – PNG يحافظ على تفاصيل الصورة كاملة ووضوحها.

• ✅ دعم الشفافية – مثالي للأيقونات والشعارات أو الرسومات التي تتطلب خلفيات شفافة.

• ✅ التوافق الواسع – PNG مدعوم من جميع أدوات التصميم والمتصفحات والمنصات.

كيفية استخدام هذا الأداة

1. تحميل ملف WebP الخاص بك
   انقر على “تحميل ملف WebP” أو اسحب وأسقط صورة إلى منطقة التحميل.

2. التحويل التلقائي
   الأداة تحول صورة WebP الخاصة بك إلى صورة PNG عالية الجودة.

3. تنزيل PNG
   انقر على زر تنزيل PNG لحفظ الملف.

4. استخدامه في أي مكان
   صورة PNG الخاصة بك جاهزة للتعديل أو المشاركة أو دمجها في مشاريع الويب أو الطباعة أو التصميم.

الأسئلة الشائعة

هل سيحتفظ PNG المحول بالشفافية؟
نعم. إذا كان ملف WebP الأصلي يحتوي على شفافية، فإن هذا المحول سيحافظ عليها في إخراج PNG.

ما يعني الضغط الخالي من الخسارة؟
الضغط الخالي من الخسارة يقلل من حجم الملف بدون التضحية بأي جودة للصورة. PNG هو تنسيق خالي من الخسارة، مما يضمن أن صورة PNG المحولة تبقى متطابقة بصريًا مع الأصل.

هل هذا الأداة مجانية وخاصة؟
مطلقًا. محول WebP إلى PNG هو قائم على المتصفح،完全 مجاني، ولا يخزن أو يشارك ملفاتك بعد التحويل.

هل يمكنني تحويله إلى تنسيقات صورة أخرى؟
نعم، اختر من تنسيق الملف أدناه.

.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;
}