تحويل الكود إلى صورة

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

طريقة إنشاء PNG للكود

  1. 1

    الصق المقتطف

    استخدم مربع الكود مع JavaScript أو HTML أو CSS أو JSON أو أوامر shell أو أي نص عادي آخر. يعرض الرسام أول 400 سطر كحد أقصى.

  2. 2

    اضبط الشكل

    اختر داكن أو فاتح أو Dracula أو Solarized، ثم عدّل العنوان وحجم الخط والحشو والخلفية والنص ولون التمييز.

  3. 3

    راجع canvas

    يرسم المتصفح كل سطر كنص على canvas، مع ترويسة نافذة وأرقام أسطر اختيارية. قد توسّع الأسطر الطويلة canvas حتى الحد الأقصى المدمج.

  4. 4

    نزّل PNG

    صدّر canvas الحالي كصورة PNG للتوثيق أو الملاحظات أو الشرائح أو المنشورات. لا يوجد تصدير SVG أو JPEG أو HTML.

ما الذي يفعله الرسام

التحكم ما يمكنك تغييره ملاحظات
السمة داكن، فاتح، Dracula، Solarized تضبط كل سمة ألوان الخلفية والنص والتمييز الابتدائية.
نمط النص العنوان، حجم الخط، الحشو حجم الخط محدود بين 10 و40 px، والحشو بين 20 و200 px.
الألوان الخلفية، النص، التمييز يستخدم لون التمييز مع أرقام الأسطر.
الترويسة ترويسة بنمط نافذة مفعلة أو معطلة يظهر العنوان في الترويسة عند تفعيلها.
أرقام الأسطر إظهار أو إخفاء ترسم الأرقام كنص عادي على canvas.
التصدير تنزيل PNG يحفظ زر التنزيل canvas الحالي كصورة PNG.

حدود عملية

  • يرسم المتصفح المقتطف كنص عادي باستخدام Canvas API. لا يتعرف على JavaScript أو Python أو HTML أو أي لغة أخرى.
  • تستخدم المعاينة أول 400 سطر حتى لا تتسبب الملفات الكبيرة جدا في تجميد الصفحة.
  • يبقى عرض canvas بين 420 px و2200 px. قد تصل الأسطر الطويلة جدا إلى العرض الأقصى.
  • تتكون الواجهة ذات الخطوتين من صفحة تحرير وصفحة تنزيل، وتحفظ مدخلاتك في sessionStorage للتبويب الحالي أثناء الانتقال بينهما.

ملاحظة حول إمكانية الوصول

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

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

لا. ترسم النص الذي تلصقه كما هو على canvas. يمكنك تغيير الألوان والسمات، لكن لا يوجد اختيار لغة أو محلل صياغة.

تتضمن القائمة داكن وفاتح وDracula وSolarized. بعد اختيار السمة يمكنك أيضا تعديل ألوان الخلفية والنص والتمييز.

لا. الناتج هو تنزيل PNG منشأ من canvas. لا يوجد تصدير SVG أو JPEG أو نسخ كـ HTML.

ترسم المعاينة أول 400 سطر حتى يبقى المتصفح سريع الاستجابة. للصور المنشورة، من الأفضل غالبا الاكتفاء بالأسطر القليلة التي تشرح الفكرة.

أدوات ذات صلة

الأداة متاحة بلغات أخرى