---
title: "Embed Electronic Signature - White-Label E-Signature | TurboDocx"
description: "Embed electronic signatures directly into your application. Signers finish in your app through a signing URL your server requests, with per-recipient identity verification."
url: "https://www.turbodocx.com/embed-electronic-signature"
---

# Embedded E-Signature For Your Application

> Embed in-app electronic signatures directly into your SaaS platform with our [powerful API](https://www.turbodocx.com/products/api-and-sdk.md). Signers finish in your app through a signing URL your server requests, not an inbox link.

At a glance: 3 ways to embed, under 5 minutes integration time, 10K+ signatures processed.

## TurboDocx Agentic Quickstart Skill

Skip the boilerplate. Run one command and your AI coding agent installs the SDK and writes a working TurboDocx integration for you, with no copy-pasting from the docs.

```bash
npx skills add TurboDocx/quickstart
```

Works with: Claude Code, Cursor, GitHub Copilot, OpenCode, Codex CLI, Gemini CLI. [Learn how it works](https://www.turbodocx.com/quickstart.md).

## See it in action

This 5-minute tutorial adds embedded e-signatures to a Node.js app, from requesting a signing URL on your server to showing it to the signer.

- Video: [Embed e-signatures in your Node.js app](https://www.youtube.com/watch?v=zA2FXRX0KPU)
- [Watch the full tutorial series](https://www.youtube.com/playlist?list=PLe0Y3BjRALjc) (Python, Go, PHP, Java, React and more)

## Key features

- **Per-Recipient Identity Verification:** Verify each signer with an email or SMS passcode, or with an assertion from the identity verification vendor you already use.
- **Seamless Integration:** Embed signing experience via iframe, redirect, or API. Works with any tech stack.
- **Mobile Optimized:** Responsive design works perfectly on desktop, tablet, and mobile devices.
- **Developer-Friendly:** Simple REST API, comprehensive SDKs, and detailed documentation with examples.
- **Enterprise Security:** Bank-level encryption, complete audit trails, and tamper-proof certificates included.
- **Workflow Automation:** Automate document routing, approvals, and notifications with powerful API webhooks.

## Embed in Minutes

Choose your integration method. Perfect for [developer teams](https://www.turbodocx.com/developers.md). Production ready.

### Server SDK (create-signing-url.ts)

```typescript
import { TurboSign } from '@turbodocx/sdk';

TurboSign.configure({
  apiKey: process.env.TURBODOCX_API_KEY,
  orgId: process.env.TURBODOCX_ORG_ID,
});

// Create the request and get a signing URL per recipient
const { recipients } = await TurboSign.createEmbeddedSignature({
  file: pdfBuffer,
  documentName: 'Service Agreement',
  recipients: [{
    name: 'Jane Doe', email: 'jane@example.com',
    auth: { emailOtp: true },
    fields: { signature: '{signature1}', date: '{date1}' },
  }],
});

// Mount it in your app: no signing email is sent
const signingUrl = recipients[0].embedUrl;
```

### iFrame Embed (embed-iframe.tsx)

```tsx
import { useState, useEffect } from 'react';

function SigningModal({ documentId }) {
  const [signingUrl, setSigningUrl] = useState('');

  useEffect(() => {
    // Get embedded signing URL from your backend
    fetch(`/api/get-signing-url/${documentId}`)
      .then(res => res.json())
      .then(data => setSigningUrl(data.signingUrl));
  }, [documentId]);

  return (
    <div className="modal-overlay">
      {/* Signing URL from your backend in an iframe */}
      <iframe
        src={signingUrl}
        width="100%"
        height="600px"
        frameBorder="0"
        allow="camera; microphone"
      />
    </div>
  );
}
```

### Embed SDK (sign-step.tsx)

```tsx
// npm install @turbodocx/embed
import { TurboSignForm } from '@turbodocx/embed/react';

function SignStep({ embedUrl }) {
  // embedUrl comes from createEmbeddedSignature or createSigningUrl on your server
  return (
    <TurboSignForm
      embedUrl={embedUrl}
      origin="https://app.turbodocx.com" {/* pinned: other origins are ignored */}
      height={720}
      onCompleted={({ documentId }) => markSigned(documentId)}
    />
  );
}
```

### Developer resources

Drop the signing page into your app with the React widget:

```bash
npm install @turbodocx/embed
```

```tsx
import { TurboSignForm } from '@turbodocx/embed/react';

<TurboSignForm embedUrl={embedUrl} origin={new URL(embedUrl).origin}
  onCompleted={({ documentId }) => markSigned(documentId)} />
```

- Complete embedded signing sample app: four working flows (the widget, your own iframe, external identity verification, and a kiosk). Clone it and run it locally. [View on GitHub](https://github.com/TurboDocx/SDK/tree/main/examples/embedded-web-app)
- Read the docs: [React widget](https://docs.turbodocx.com/docs/TurboSign/embedded-signing/react-widget), [Embedded signing reference](https://docs.turbodocx.com/docs/TurboSign/embedded-signing)
- Packages: [@turbodocx/embed](https://www.npmjs.com/package/@turbodocx/embed), [@turbodocx/sdk](https://www.npmjs.com/package/@turbodocx/sdk)

[Start free trial](https://app.turbodocx.com/signup) or [view integration docs](https://docs.turbodocx.com).

## Mint the URL the Moment Your Signer Is Ready (On-Demand Signing URLs)

Call `createSigningUrl` at the exact moment a signer is ready, and TurboDocx returns the URL for that recipient. Open it in an iframe, a redirect, or a new tab. What you get depends on how the signer is verified: a passcode or unverified signer gets their reusable signing link, valid for the life of the document, and the passcode gate still applies. A signer verified by your own identity provider (or an admin-enabled override) gets a single-use link that expires about 5 minutes after it is issued, so request it at the moment of signing. When you need OTP, the same call reports which checks are pending so your app can step the signer through them. Walk through the full flow in the [createSigningUrl embedding guide](https://www.turbodocx.com/guides/embed-signing-with-createsigningurl.md).

```typescript
import { TurboSign } from '@turbodocx/sdk';

// Called when the signer is ready, not hours earlier in an email
const { url, expiresAt, pendingChecks } = await TurboSign.createSigningUrl(documentId, {
  recipientId: signer.id,
  returnUrl: 'https://app.yourcompany.com/signed',
});

// Passcode or unverified signer: reusable ?token= link for the life of the document.
// External identity verification: single-use ?sut= link, about 5 minutes.
// pendingChecks: ['email_otp'] means the page will ask for a passcode.
iframe.src = url;
```

## Three Ways to Place the Signing Experience

One signing URL, three placement modes. Pick the one that fits your product surface.

- **iFrame Embed:** Keep signers inside your app. Drop the URL into an iframe so the signing flow renders in place, with no navigation away from your product.
- **Full-Page Redirect:** Send the signer to the full-page signing experience, then return them to your app with a completion redirect. Best for the simplest, most robust handoff.
- **New Tab or Popup:** Open signing in a separate tab or popup window so your app stays exactly where it was. Useful when signing is one step in a longer workflow.

## Deny-by-Default Embedding Domains (Secure by Default)

The `allowedEmbeddingDomains` allow-list starts empty, so nothing can iframe your signing page until you add your exact https origin. That is the control that closes the clickjacking gap: an attacker cannot frame the signing experience from a domain you did not explicitly approve. http and localhost origins are accepted for local development only, never for production embedding.

- Allow-list starts empty: no origin can embed the signing page until you add it.
- Add your exact https origin to permit embedding. Wildcard trust is not the default.
- Clickjacking control: framing is refused from any domain you did not approve.
- http and localhost are accepted for development only, not for production.

Locking down where the page can be embedded is one half of the story. The other half is knowing who is on the other end. TurboDocx can [verify signers before they sign](https://www.turbodocx.com/electronic-signature-identity-verification.md) with email OTP, SMS OTP, or an external identity provider assertion selectable per signer, and records the verification method on each signer's certificate of completion. If your app already verified the signer, [bring your own identity verification](https://www.turbodocx.com/resources/bring-your-own-identity-verification-esignature.md) instead.

## For SaaS Products: Native App Experience

Build signature functionality directly into your product. Users stay in your app with zero friction. Our [e-signature API](https://www.turbodocx.com/e-signature-api.md) makes integration simple for [developers](https://www.turbodocx.com/developers.md).

- Seamless in-app signing experience
- Signers never leave your app
- No redirects to external sites
- Fully responsive mobile experience

## For Enterprises: Enterprise Integration

Advanced features and dedicated support for large organizations with high-volume needs. Perfect for [IT teams](https://www.turbodocx.com/use-cases/it-teams.md) managing enterprise workflows.

- Priority API access and support
- Advanced webhook configurations
- Custom security policies
- Dedicated account manager

## Related Resources

- [Best E-Signature API Comparison](https://www.turbodocx.com/best-esignature-api-comparison.md): Discover the latest e-signature API solutions and embedding options.
- [React E-Signature Component](https://www.turbodocx.com/guides/embed-esignature-in-react.md): Render the signing page in React with @turbodocx/embed.
- [In-Person E-Signature](https://www.turbodocx.com/use-cases/in-person-esignature.md): Collect every signature on one kiosk or tablet, in order.

## Ready to Embed Signatures?

Get started with our free tier. Full API access included. Need [automated document signing workflows](https://www.turbodocx.com/e-signature-api.md)? We've got you covered. Under 5 minutes setup, no credit card required, deny-by-default embedding domains.

[Get started free](https://app.turbodocx.com/signup), [join Discord](https://discord.gg/NYKwz4BcpX), or [see a live demo](https://www.turbodocx.com/demo).
