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.

    See the Vue Signature component demo

    Signature Overview
  • 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.

    See the Vue Controlled Mode demos

  • 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.

    See the Vue Signature Appearance demo

  • 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.

    See the Vue Signature Popup demo

  • 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.

    See the Vue Signature Line Smoothing demo

  • 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.

    See the Vue Read-only and Disabled demos

Next Steps

Get Started with Kendo UI for Vue

Kendo UI for Vue - Kendoka