مولد التوقيع

قم بإنشاء توقيع مخصص خاص بك وحمّله بسهولة.

4.94 من 18 التقييمات

16:9 4:3 3:4 1:1

1. المقدمة

مولد التوقيع هو أداة تعمل عبر المتصفح تتيح لك إنشاء توقيع رقمي بخط اليد باستخدام الفأرة أو لوحة اللمس أو شاشة اللمس. يمكنك رسم توقيعك مباشرة على لوحة الرسم، وتخصيص لونه وسماكته، وضبط الخلفية (بما في ذلك الشفافية)، ثم تصديره إلى عدة تنسيقات صور مثل SVG وPNG وJPG وWEBP.

تُعد هذه الأداة مثالية لتوقيع المستندات الرقمية، وإضافة التوقيعات إلى ملفات PDF، وإدراج توقيع في تذييل رسائل البريد الإلكتروني، أو إعداد صور توقيع شفافة لمشاريع التصميم. وبما أن كل شيء يتم داخل متصفحك، فلا حاجة إلى رفع الملفات أو إجراء أي معالجة على الخادم. يتم إنشاء توقيعك فورًا، ويمكن تنزيله مباشرة بالتنسيق الذي تحتاجه.

سواء كنت بحاجة إلى ملف PNG شفاف للعقود، أو ملف SVG قابل للتكبير للطباعة، أو ملف JPG للمشاركة السريعة، فإن مولد التوقيع هذا يوفر حلاً سريعًا ومرنًا للاستخدام الشخصي والمهني.

2. كيفية عمله

تستخدم الأداة لوحة HTML5 تفاعلية تتيح للمستخدمين الرسم بحرية. يتم تسجيل كل ضربة كمسار من النقاط، بما في ذلك بيانات الموضع والوقت والضغط (عند توفرها). ثم تتم معالجة هذه النقاط وتحويلها إلى منحنيات سلسة، مما يضمن ظهور الخط بشكل طبيعي بدلاً من الخطوط الخشنة أو المتعرجة.

معلمات الإدخال

منطقة لوحة الرسم: سطح الرسم الذي تنشئ عليه توقيعك.
لون القلم: اختر لونًا مخصصًا للكتابة بتنسيق سداسي عشري (يتم تحويله داخليًا إلى RGB).
لون الخلفية: اختر لونًا ثابتًا أو خلفية شفافة باستخدام قيم RGBA.
سُمك القلم: ثلاثة مستويات سماكة قابلة للاختيار تضبط الحد الأدنى والأقصى لعرض الخط.
نسبة العرض إلى الارتفاع: اختر بين 16:9 أو 4:3 أو 3:4 أو 1:1 للتحكم في أبعاد لوحة الرسم.

منطق عرض الخطوط

أثناء الرسم، يلتقط النظام أحداث المؤشر أو اللمس ويحوّلها إلى أجزاء من المنحنيات. كما يحسب سرعة حركة الخط لضبط سماكته ديناميكيًا، مما ينتج تأثيرًا طبيعيًا يشبه الكتابة بالقلم. يتم تخزين كل ضربة كبيانات منظمة، مما يتيح ميزات مثل التراجع وإعادة رسم الخلفية دون فقدان التوقيع.

قواعد التحقق

إذا كانت قيمة سُمك القلم أقل من 1، فسيتم استخدام أقل سماكة مدعومة افتراضيًا.
يجب أن تكون قيم الألوان بتنسيق سداسي عشري صالح.
يتم تقييد تغيير حجم لوحة الرسم بعد بدء الرسم لمنع التشوه.
تقوم ميزة التراجع بإزالة آخر ضربة فقط إذا كانت بيانات الضربات موجودة.

تنسيقات الإخراج

يمكنك تصدير توقيعك بالتنسيقات التالية:

SVG – تنسيق متجهي قابل للتكبير، مثالي للطباعة عالية الدقة.
PNG – يدعم الشفافية.
JPG – تنسيق مضغوط للاستخدام العام.
WEBP – تنسيق صور حديث ومحسن.

القيود

لا تتحقق الأداة من الهوية ولا توفر مصادقة ملزمة قانونيًا.
يتم رسم التوقيعات يدويًا ولا يتم إنشاؤها تلقائيًا من النص.
قد يتطلب تغيير الحجم بعد الرسم مسح لوحة الرسم.

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

اختر نسبة العرض إلى الارتفاع المفضلة لديك للوحة الرسم.
حدد مستوى سُمك القلم.
اضبط لون التوقيع الذي تريده.
يمكنك اختيار لون الخلفية اختياريًا (أو تركها شفافة).
ارسم توقيعك باستخدام الفأرة أو شاشة اللمس.
استخدم تراجع لإزالة آخر ضربة عند الحاجة.
انقر على مسح لإعادة تعيين لوحة الرسم بالكامل.
نزّل توقيعك بتنسيق SVG أو PNG أو JPG أو WEBP.

4. أمثلة عملية

المثال 1: ملف PNG شفاف لعقود PDF

الإدخال:

نسبة العرض إلى الارتفاع: 4:3
لون القلم: أسود (#000000)
الخلفية: شفافة
سُمك القلم: متوسط

الإخراج: download.png (خلفية شفافة)

استخدم هذا الملف لإدراج توقيعك في عقد PDF دون ظهور مربع أبيض خلفه.

المثال 2: ملف SVG عالي الدقة للطباعة

الإدخال:

نسبة العرض إلى الارتفاع: 16:9
لون القلم: أزرق (#1a73e8)
الخلفية: بيضاء
سُمك القلم: عريض

الإخراج: download.svg

نظرًا لأن SVG تنسيق متجهي، فإن التوقيع يظل واضحًا عند تغيير حجمه لاستخدامه في الأوراق الرسمية أو المواد المطبوعة.

5. حالات استخدام للمطورين

- أنظمة أتمتة المستندات

ادمج صور التوقيع التي تم تنزيلها في سير عمل إنشاء المستندات الآلي (مثل العقود والفواتير والاتفاقيات).

- التقاط التوقيع من جانب العميل

استخدم بيانات الصورة المصدّرة بتنسيق Base64 لعمليات الرفع عبر AJAX:

const dataUrl = signaturePad.toDataURL('image/png');
// أرسل dataUrl إلى واجهة برمجة التطبيقات الخلفية للتخزين

- تضمين SVG في تطبيقات الويب

نظرًا لأن إخراج SVG يعتمد على الرسومات المتجهية، فيمكن تضمينه مباشرة داخل HTML:

<img src="signature.svg" alt="توقيع رقمي">

- التعامل الآمن مع البيانات

نظرًا لأن إنشاء التوقيع يتم بالكامل داخل المتصفح، فلا حاجة إلى معالجة على جانب الخادم إلا إذا تم تنفيذها صراحةً. وهذا يقلل من مخاطر كشف البيانات. ويمكن للمطورين التحقق من سلاسل Base64 على جانب الخادم قبل حفظها لمنع إدخال بيانات غير صالحة.

- المعالجة الخلفية باستخدام PHP

$base64 = $_POST['signature'];
$image = str_replace('data:image/png;base64,', '', $base64);
$image = base64_decode($image);
file_put_contents('signature.png', $image);