Trình tạo chữ ký
Tạo chữ ký tùy chỉnh của riêng bạn và tải xuống dễ dàng.
1. Giới thiệu
Trình tạo chữ ký là một công cụ chạy trên trình duyệt cho phép bạn tạo chữ ký số viết tay bằng chuột, bàn di chuột hoặc màn hình cảm ứng. Bạn có thể vẽ chữ ký trực tiếp trên vùng vẽ, tùy chỉnh màu sắc và độ dày, điều chỉnh nền (bao gồm cả nền trong suốt), đồng thời xuất dưới nhiều định dạng hình ảnh như SVG, PNG, JPG và WEBP.
Công cụ này lý tưởng để ký tài liệu số, thêm chữ ký vào tệp PDF, nhúng chữ ký vào phần chân email hoặc chuẩn bị hình ảnh chữ ký trong suốt cho các dự án thiết kế. Vì mọi thao tác đều diễn ra trên trình duyệt của bạn nên không cần tải tệp lên hoặc xử lý phía máy chủ. Chữ ký của bạn được tạo ngay lập tức và có thể tải xuống ngay theo định dạng bạn cần.
Cho dù bạn cần một tệp PNG trong suốt gọn gàng cho hợp đồng, một tệp SVG có thể mở rộng để in hoặc một tệp JPG để chia sẻ nhanh, trình tạo chữ ký này đều mang đến giải pháp nhanh chóng và linh hoạt cho cả nhu cầu cá nhân và công việc.
2. Cách hoạt động
Công cụ sử dụng một vùng vẽ HTML5 tương tác, nơi người dùng có thể vẽ các nét tự do. Mỗi nét vẽ được ghi lại dưới dạng một chuỗi các điểm, bao gồm vị trí, thời gian và dữ liệu áp lực (khi có). Các điểm này được xử lý thành các đường cong mượt mà, giúp chữ viết tay trông tự nhiên thay vì các đường nét thô hoặc gấp khúc.
Các tham số đầu vào
- Vùng vẽ: Bề mặt vẽ nơi bạn tạo chữ ký.
- Màu bút: Chọn màu viết tùy chỉnh theo định dạng thập lục phân (được chuyển đổi nội bộ sang RGB).
- Màu nền: Chọn màu nền đồng nhất hoặc nền trong suốt bằng các giá trị RGBA.
- Độ dày bút: Ba mức độ dày có thể chọn để điều chỉnh độ rộng nét vẽ tối thiểu và tối đa.
- Tỷ lệ khung hình: Chọn giữa 16:9, 4:3, 3:4 hoặc 1:1 để kiểm soát kích thước vùng vẽ.
Logic hiển thị nét vẽ
Khi bạn vẽ, hệ thống sẽ ghi lại các sự kiện con trỏ hoặc cảm ứng và chuyển đổi chúng thành các đoạn đường cong. Hệ thống tính toán tốc độ của nét vẽ để điều chỉnh độ dày đường nét một cách linh hoạt, tạo hiệu ứng giống bút viết tự nhiên. Mỗi nét vẽ được lưu dưới dạng dữ liệu có cấu trúc, cho phép sử dụng các tính năng như hoàn tác và vẽ lại nền mà không làm mất chữ ký.
Quy tắc xác thực
- Giá trị độ dày bút nhỏ hơn 1 sẽ mặc định về mức độ dày tối thiểu được hỗ trợ.
- Giá trị màu phải tuân theo định dạng thập lục phân hợp lệ.
- Việc thay đổi kích thước vùng vẽ sẽ bị hạn chế sau khi bắt đầu vẽ để tránh làm biến dạng chữ ký.
- Chức năng Hoàn tác chỉ xóa nét vẽ gần nhất nếu dữ liệu nét vẽ tồn tại.
Định dạng đầu ra
Bạn có thể xuất chữ ký của mình dưới các định dạng:
- SVG – Định dạng đồ họa vector có thể mở rộng, lý tưởng để in với độ phân giải cao.
- PNG – Hỗ trợ nền trong suốt.
- JPG – Định dạng nén cho mục đích sử dụng thông thường.
- WEBP – Định dạng hình ảnh hiện đại được tối ưu hóa.
Giới hạn
- Công cụ không xác minh danh tính hoặc cung cấp xác thực có giá trị pháp lý.
- Chữ ký được vẽ thủ công và không tự động tạo từ văn bản.
- Việc thay đổi kích thước sau khi vẽ có thể yêu cầu xóa vùng vẽ.
3. Cách sử dụng công cụ này
- Chọn tỷ lệ khung hình mong muốn cho vùng vẽ.
- Chọn mức độ dày bút.
- Đặt màu chữ ký mong muốn.
- Tùy chọn chọn màu nền (hoặc giữ nền trong suốt).
- Vẽ chữ ký bằng chuột hoặc màn hình cảm ứng.
- Sử dụng Hoàn tác để xóa nét vẽ cuối cùng nếu cần.
- Nhấp vào Xóa để đặt lại hoàn toàn vùng vẽ.
- Tải xuống chữ ký ở định dạng SVG, PNG, JPG hoặc WEBP.
4. Ví dụ thực tế
Ví dụ 1: PNG trong suốt cho hợp đồng PDF
Đầu vào:
- Tỷ lệ khung hình: 4:3
- Màu bút: Đen (#000000)
- Nền: Trong suốt
- Độ dày bút: Trung bình
Đầu ra: download.png (nền trong suốt)
Sử dụng tệp này để chèn chữ ký của bạn vào hợp đồng PDF mà không có khung màu trắng phía sau.
Ví dụ 2: SVG độ phân giải cao để in
Đầu vào:
- Tỷ lệ khung hình: 16:9
- Màu bút: Xanh dương (#1a73e8)
- Nền: Trắng
- Độ dày bút: Đậm
Đầu ra: download.svg
Vì SVG là định dạng dựa trên đồ họa vector nên chữ ký vẫn giữ được độ sắc nét khi thay đổi kích thước để sử dụng trên giấy tiêu đề hoặc tài liệu in.
5. Trường hợp sử dụng cho nhà phát triển
- Hệ thống tự động hóa tài liệu
Tích hợp các hình ảnh chữ ký đã tải xuống vào quy trình tạo tài liệu tự động (ví dụ: hợp đồng, hóa đơn, thỏa thuận).
- Thu thập chữ ký phía máy khách
Sử dụng dữ liệu hình ảnh Base64 đã xuất cho các lần tải lên bằng AJAX:
const dataUrl = signaturePad.toDataURL('image/png');
// Gửi dataUrl đến API backend để lưu trữ
- Nhúng SVG trong ứng dụng web
Vì đầu ra SVG dựa trên đồ họa vector nên có thể được nhúng trực tiếp vào HTML:
<img src="signature.svg" alt="Chữ ký số">
- Xử lý dữ liệu an toàn
Vì việc tạo chữ ký diễn ra hoàn toàn trên trình duyệt nên không cần xử lý phía máy chủ trừ khi được triển khai rõ ràng. Điều này giúp giảm nguy cơ lộ dữ liệu. Nhà phát triển có thể xác thực chuỗi Base64 ở phía máy chủ trước khi lưu để ngăn dữ liệu đầu vào không hợp lệ.
- Xử lý nền bằng PHP
$base64 = $_POST['signature'];
$image = str_replace('data:image/png;base64,', '', $base64);
$image = base64_decode($image);
file_put_contents('signature.png', $image);
6. Câu hỏi thường gặp
$base64 = $_POST['signature'];
$image = str_replace('data:image/png;base64,', '', $base64);
$image = base64_decode($image);
file_put_contents('signature.png', $image);Chữ ký này có giá trị pháp lý không?
Không. Công cụ này tạo ra hình ảnh số của chữ ký viết tay của bạn. Giá trị pháp lý phụ thuộc vào quy định của từng khu vực pháp lý và cách chữ ký được sử dụng.
Tôi có thể tạo chữ ký trong suốt không?
Có. Chọn nền trong suốt và tải xuống dưới dạng PNG hoặc SVG.
Định dạng nào phù hợp nhất để in?
SVG được khuyến nghị để in với độ phân giải cao vì có thể thay đổi kích thước mà không làm giảm chất lượng.
Tôi có thể thay đổi độ dày của bút không?
Có. Bạn có thể chọn một trong ba mức độ dày nét vẽ được xác định trước.
Công cụ có lưu trữ chữ ký của tôi không?
Không. Chữ ký được tạo cục bộ trên trình duyệt của bạn trừ khi bạn tự tải nó lên nơi khác.
Tôi có thể hoàn tác một phần chữ ký của mình không?
Có. Nút Hoàn tác sẽ xóa nét vẽ gần đây nhất.
Công cụ phổ biến
Đảo ngược ký tự trong câu hoặc đoạn văn.
Lấy kích thước văn bản tính bằng Byte (B), Kilobyte (KB), hoặc Megabyte (MB).
Đếm số ký tự và từ trong đoạn văn bản.
Lật ngược văn bản một cách dễ dàng.
Chuyển số thành dạng chữ viết đầy đủ.
Chuyển văn bản thường sang kiểu chữ viết tay.