Kendo UI for Vue
Vue Signature
- Solve your digital document needs by allowing users to draw or import signatures.
- Part of the Kendo UI for Vue library along with 100+ professionally-designed components.
- Includes support, documentation, demos, virtual classrooms, learning resources and more!
-
Collect Signatures in Your Vue Applications
The Vue Signature component enables end-users to digitally sign documents by touch, mouse, or image import. The Signature component can be used as part of a standalone signature application, a web form, and in combination with a PDF export. Key features include a popup for entry, line smoothing for clean signatures, and control over import and export resolution.
-
Controlled Mode
You can make the Vue Signature component behave the way you need by controlling various aspects.
- Set a value on initialization, via onChange event, or through props.
- Control the export resolution for screen or print use.
- Set import scaling. The component scales imported images to the dimensions of the component by default but you can change it if needed.
-
Appearance
Vue The Signature component helps you make it look the way you like by providing various appearance properties rather than requiring tedious CSS. These include size, corner radius, line and background color, fill mode, and stroke width.
-
Popup
To provide users with the easiest signature creation experience, the Vue Signature component can be opened in a modal popup. This is especially useful on mobile devices. In this case, you can save space by displaying a small version of the signature for viewing and a larger version for editing/input.
-
Line Smoothing
The Vue Signature component helps users provide nice-looking signatures with a line smoothing feature. When drawing a signature on screen with one's finger or mouse, lines are often choppy and jagged. This feature will smooth them out and make them look more natural.
-
Read-only and Disabled States
By setting simple properties, you can set the state of the Vue Signature component to read-only or disabled. When it is read-only the user can still perform interactions such as opening the signature in a pop-up. When the state is disabled, no interaction or navigation is possible.
Get Started with Kendo UI for Vue
