الوضع
صيغة الإخراج
العرض
مقياس الإخراج
شفافة
القوالب
يمكنك إضافة روابط صور، مثل: <img src="https://images.unsplash.com/photo-1500530855697-b586d89ba3ee?auto=format&fit=crop&w=1600&q=80" />
معاينة
HTML إلى صورة — تصدير PNG وJPG
حوّل تخطيط HTML وCSS إلى صورة ثابتة. اضبط مقاس اللوحة وراجع المعاينة ثم صدّر PNG أو JPG.
طريقة الاستخدام
1
ضبط الإعدادات
اكتب HTML وCSS أو اختر قالبًا، ثم اضبط عرض الصورة.
2
مراجعة النتيجة
صورة من تخطيط HTML المعروض في المعاينة.
أمثلة فعلية
HTML إلى صورة — تصدير PNG وJPG · مثال 1
عولجت هذه الملفات بهذه الأداة أو بالكود نفسه الذي تستخدمه. يمكنك مقارنة الملفات الأصلية والإعدادات والنتائج وتنزيلها للتحقق.
PNG1000 × 640 px
المدخل2
<section><small>01 / 03</small><h1>2026</h1><p>09 / 22</p></section>
*{box-sizing:border-box} body{margin:0} section{padding:56px;background:#153d36;color:#f7e3b6;min-height:320px;font-family:system-ui;border-radius:20px} small{letter-spacing:4px;font-size:16px} h1{font-size:72px;line-height:1.1;margin:30px 0} p{font-size:22px}الملفات الأصلية (2)
قبل الحفظ
ما يجب التحقق منه
الصور والخطوط الخارجية قد تفشل بسبب أذونات المصدر أو الاتصال. افحص النتيجة قبل التنزيل.
أمثلة فعلية
HTML إلى صورة — تصدير PNG وJPG · أمثلة إضافية
عولجت هذه الملفات بهذه الأداة أو بالكود نفسه الذي تستخدمه. يمكنك مقارنة الملفات الأصلية والإعدادات والنتائج وتنزيلها للتحقق.
PNG1000 × 640 px
المدخل2
<section><small>02 / 03</small><h1>12:30</h1><p>09 / 22 · 2026</p></section>
*{box-sizing:border-box} body{margin:0} section{padding:56px;background:#f5e6d8;color:#673f2f;min-height:320px;font-family:system-ui;border-radius:20px} small{letter-spacing:4px;font-size:16px} h1{font-size:72px;line-height:1.1;margin:30px 0} p{font-size:22px}الملفات الأصلية (2)
PNG1000 × 640 px
المدخل2
<section><small>03 / 03</small><h1>01 → 02</h1><p>12 + 24 = 36</p></section>
*{box-sizing:border-box} body{margin:0} section{padding:56px;background:#e4eef4;color:#214762;min-height:320px;font-family:system-ui;border-radius:20px} small{letter-spacing:4px;font-size:16px} h1{font-size:72px;line-height:1.1;margin:30px 0} p{font-size:22px}الملفات الأصلية (2)
أسئلة شائعة
صورة من تخطيط HTML المعروض في المعاينة.
الصور والخطوط الخارجية قد تفشل بسبب أذونات المصدر أو الاتصال. افحص النتيجة قبل التنزيل.