# Docs - [Ready to boost your conversions rates?](/): Start converting website visitors into leads in minutes - Docs - Surface Tag - [Installation](/docs/surface-tag/installation): Embed the surface tag - Form Embedding - [Inline Form Embed](/docs/form-embedding/inline): Embed your form inline with the rest of your page - [Popup Form Embed](/docs/form-embedding/popup): Display your form as a popup modal - [Slideover Form Embed](/docs/form-embedding/slideover): Display your form as a full page slide-over - [Widget Form Embed](/docs/form-embedding/widget): Display your form as a customizable widget on your website - [Email Input Field Trigger](/docs/form-embedding/input-field): Triggering via email input field submission - [Optimize Loading Speed](/docs/form-embedding/optimize): Optimize Surface Forms loading speed for better performance - [Direct Link](/docs/form-embedding/direct-link): Automatically trigger the form to appear when the page loads - API Reference - [API Keys](/docs/api-reference/api-keys): Learn how to create and manage API keys for the Surface API - Forms - [Generate Form](/docs/api-reference/forms/generate-form): Programmatically create a new form from a source template using the API - Responses - [Get All Responses](/docs/api-reference/responses/get-all-responses): Retrieve all form responses for your environment - [Get Form Responses](/docs/api-reference/responses/get-form-responses): Retrieve responses for a specific form - [Component Response Shapes](/docs/api-reference/responses/component-response-shapes): Reference documentation for all supported component response shapes - MCP Server - [MCP Server](/docs/mcp-server/overview): Connect any MCP-compatible AI assistant to Surface and build forms, query your funnel, and manage content with natural language - [API Setup](/docs/mcp-server/setup): Connect the Surface MCP server to your AI assistant - [Claude OAuth Setup](/docs/mcp-server/claude-oauth-setup): Connect Surface to Claude via OAuth using the Connectors feature — no API key required - [Tool Bundles](/docs/mcp-server/tool-bundles): How the 110 MCP tools are organized into bundles and families, what loads by default, and how to choose the tools your connection gets - [Tool Reference](/docs/mcp-server/tools): Complete reference for all 110 MCP tools available in the Surface MCP server - Events - [Form Events](/docs/events/form-events): Learn about the events emitted by Surface forms that can be used with Google Tag Manager, Google Ads, and Meta Ads. - [Google Tag Manager Integration](/docs/events/google-tag-manager): A step-by-step guide to connect Surface Form events to Google Tag Manager (GTM) - [Google Ads Tracking](/docs/events/google-ads-tracking): Add GTM Container ID to Surface Form to configure various marketing tags from a single place - [Google Analytics Tracking](/docs/events/google-analytics-tracking): Track Surface Form events in Google Analytics using Google Tag Manager (GTM) - [Meta Ads Tracking](/docs/events/meta-ads-tracking): Track Surface Form conversions in Meta Ads - External Forms - **Link External HTML Form** - [External HTML Forms Integration](/docs/external-forms/overview): Complete guide to linking and tracking external HTML forms with Surface - [Step 1: Embed Surface Scripts](/docs/external-forms/embedding): Add Surface Scripts to your Site - [Step 2: Create External Form](/docs/external-forms/create-external-form): Create an external form in Surface Labs - [Step 3.1: Create Multi-Step HTML Form](/docs/external-forms/create-multi-step-html-form): Create a multi-step HTML form - [Step 3.2: Modify Form Fields](/docs/external-forms/modify-form-fields): Modify form fields in Multi-Step HTML Form - [Step 3.3: Submit Form](/docs/external-forms/submit-form): Submit Multi-Step HTML Form - Workflows - [Slack](/docs/workflows/slack): This guide will help you integrate Slack with Surface - [HubSpot](/docs/workflows/hubspot): This guide will help you integrate HubSpot with Surface Forms - [Salesforce](/docs/workflows/salesforce): Connect your forms with Salesforce to automatically create contacts and opportunities - [Zapier](/docs/workflows/zapier): Utilize Zapier to send Surface form submission data to various destinations and trigger actions. - Website Visitor De-Anonymization - [Website Visitor De-anonymization](/docs/website-visitor-deanonymization/overview): Reveal anonymous website visitors with Surface's built-in identification technology - Tracking - [HubSpot Tracking](/docs/tracking/hubspot-tracking): Learn how to add HubSpot tracking script to your Surface forms for enhanced analytics and visitor insights. - Platform - [Leads Table](/docs/platform/leads-table): A unified view of all your leads with automatic enrichment and scoring - Form Builder - [Form Builder](/docs/platform/form-builder/form-builder): Create powerful, conversion-optimized forms with our no-code builder - [Conditional Logic](/docs/platform/form-builder/conditional-logic): Control how users move through your form with conditional logic and branching flows - [Workflows](/docs/platform/form-builder/workflows): Build powerful follow-up workflows for every form submission and website visitor - [Response Table](/docs/platform/response-table): Your central hub for managing all form submissions with advanced filtering and lead insights - [Form Analytics](/docs/platform/form-analytics): Track views, starts, completions, drop-offs, and conversion rates to optimize form performance - Guides - Form Embedding - [Embed Surface Forms in your website builder or framework](/guides/embedding/website-editors): Step-by-step guides for embedding Surface Forms in Framer, Webflow, WordPress, React, Next.js, and other popular website builders and frameworks. - Framer - [Framer Integration](/guides/embedding/framer/overview): Complete guide to embedding Surface Forms in your Framer site - [Step 1: Embed Surface Tag](/guides/embedding/framer/embedding): Add a Surface Tag to your Framer Site - **Step 2: Embed Surface Form** - [Inline](/guides/embedding/framer/inline): Embed a Surface Form inline - [Email Input Field Trigger](/guides/embedding/framer/input-field): Triggering via email input field submission - [Popup](/guides/embedding/framer/popup): Embed a Surface Form popup - [Slideover](/guides/embedding/framer/slideover): Embed a Surface Form slideover - [Step 3: Optimize](/guides/embedding/framer/optimize): Optimize Surface Form loading speed - Webflow - [Webflow Integration](/guides/embedding/webflow/overview): Complete guide to embedding Surface Forms in your Webflow site - [Step 1: Embed Surface Tag](/guides/embedding/webflow/embedding): Add a Surface Tag to your Webflow Site - **Step 2: Embed Surface Form** - [Inline](/guides/embedding/webflow/inline): Embed a Surface Form inline - [Email Input Field Trigger](/guides/embedding/webflow/input-field): Triggering via email input field submission - [Popup](/guides/embedding/webflow/popup): Embed a Surface Form popup - [Slideover](/guides/embedding/webflow/slideover): Embed a Surface Form slideover - [Step 3: Optimize](/guides/embedding/webflow/optimize): Optimize Surface Form loading speed - React.js - [React.js Integration](/guides/embedding/react/overview): Complete guide to embedding Surface Forms in your React.js site - [Step 1: Embed Surface Tag](/guides/embedding/react/embedding): Add a Surface Tag to your React Site - **Step 2: Embed Surface Form** - [Inline](/guides/embedding/react/inline): Embed a Surface Form inline - [Email Input Field Trigger](/guides/embedding/react/input-field): Triggering via email input field submission - [Popup](/guides/embedding/react/popup): Embed a Surface Form popup - [Slideover](/guides/embedding/react/slideover): Embed a Surface Form slideover - [Step 3: Optimize](/guides/embedding/react/optimize): Optimize Surface Form loading speed - Next.js - [Next.js Integration](/guides/embedding/next/overview): Complete guide to embedding Surface Forms in your Next.js site - App Router - [Step 1: Embed Surface Tag](/guides/embedding/next/app-router/embedding): Add a Surface Tag to your Next.js Site - **Step 2: Embed Surface Form** - [Inline](/guides/embedding/next/app-router/inline): Embed a Surface Form inline - [Email Input Field Trigger](/guides/embedding/next/app-router/input-field): Triggering via email input field submission - [Popup](/guides/embedding/next/app-router/popup): Embed a Surface Form popup - [Slideover](/guides/embedding/next/app-router/slideover): Embed a Surface Form slideover - [Step 3: Optimize](/guides/embedding/next/app-router/optimize): Optimize Surface Form loading speed - Page Router - [Step 1: Embed Surface Tag](/guides/embedding/next/page-router/embedding): Add a Surface Tag to your Next.js Site - **Step 2: Embed Surface Form** - [Inline](/guides/embedding/next/page-router/inline): Embed a Surface Form inline - [Email Input Field Trigger](/guides/embedding/next/page-router/input-field): Triggering via email input field submission - [Popup](/guides/embedding/next/page-router/popup): Embed a Surface Form popup - [Slideover](/guides/embedding/next/page-router/slideover): Embed a Surface Form slideover - [Step 3: Optimize](/guides/embedding/next/page-router/optimize): Optimize Surface Form loading speed - Unbounce - [Unbounce Integration](/guides/embedding/unbounce/overview): Complete guide to embedding Surface Forms in your Unbounce site - [Step 1: Embed Surface Tag](/guides/embedding/unbounce/embedding): Add a Surface Tag to your Unbounce Site - **Step 2: Embed Surface Form** - [Inline](/guides/embedding/unbounce/inline): Embed a Surface Form inline - [Email Input Field Trigger](/guides/embedding/unbounce/input-field): Triggering via email input field submission - [Popup](/guides/embedding/unbounce/popup): Embed a Surface Form popup - [Slideover](/guides/embedding/unbounce/slideover): Embed a Surface Form slideover - [Step 3: Optimize](/guides/embedding/unbounce/optimize): Optimize Surface Form loading speed - HubSpot Forms Configuration - [Connect Surface to your HubSpot forms](/guides/hubspot-forms/overview): Configure Surface Forms to supercharge your HubSpot forms with partial response tracking, user journey insights, and more. - **Getting Started** - [One Click Setup](/guides/hubspot-forms/one-click-setup): Create HubSpot forms from Surface and start syncing partial & complete submissions - **Custom Configuration** - [Custom Configuration](/guides/hubspot-forms/manual-setup): Select your target HubSpot form and define exactly how fields map between Surface and HubSpot - [Step 1: Configure HubSpot Form](/guides/hubspot-forms/configure-hubspot-form): Configure your HubSpot form to accept submissions from Surface Forms - [Step 2: Configure HubSpot in Surface Workflow](/guides/hubspot-forms/configure-workflow): Set up workflows in Surface to send form submissions to HubSpot - [Step 3: Add Surface Domain to HubSpot](/guides/hubspot-forms/add-surface-domain): Add forms.withsurface.com to HubSpot's Additional Site Domains for proper tracking and form submissions - [HubSpot Tracking](/guides/hubspot-forms/configure-tracking): Add HubSpot tracking script to your Surface form for enhanced analytics and visitor insights - **Guides** - [Creating Your First Surface Form](/guides/first-form): Learn how to create your first Surface Form - [API based Conditional Logic](/guides/control-form-logic-based-on-api): Conditional Form Logic Based on Your API Response - [Enable Cloudflare Turnstile](/guides/enable-cloudflare-turnstile): Learn how to enable **Cloudflare Turnstile** and add the widget to your Surface Form to protect your forms from spam and abuse. - [Send Data to HubSpot](/guides/send-data-to-hubspot): Learn how to send Surface Form submissions directly to HubSpot using the built-in HubSpot action in the Workflow Builder - [Send Data to Airtable](/guides/send-data-to-airtable): Learn how to send Surface Form submissions to Airtable using webhooks - [Send Data to Surface using Webhooks](/guides/send-data-to-surface): Learn how to send data to Surface using webhooks - Email Sequences with Customer.io and Calendly - [Email Sequences with Customer.io and Calendly](/guides/email-sequences-customerio-calendly/overview): Complete guide to running email sequences triggered by Surface form submissions, with automatic exit when leads book a meeting - [Step 1: Webhook Trigger Campaigns](/guides/email-sequences-customerio-calendly/step-1-webhook-trigger): Create two webhook-triggered campaigns in Customer.io—one for partial submissions and one for completed—each with its own URL - [Step 2: Configure Surface Workflow](/guides/email-sequences-customerio-calendly/step-2-surface-workflow): Set up the Surface Workflow Builder to send form data to Customer.io via webhook when leads submit (partial or completed) - [Step 3: Event-Based Email Campaigns](/guides/email-sequences-customerio-calendly/step-3-event-campaigns): Create event-triggered campaigns for partial and completed form submissions with customizable follow-up emails and delays - [Step 4: Calendly Meeting Check](/guides/email-sequences-customerio-calendly/step-4-calendly-check): Add a webhook node to check if the lead has booked a Calendly meeting—exit the campaign if yes, continue if no - Email Sequences with HubSpot - [Email Sequences with HubSpot](/guides/email-sequences-hubspot/overview): Enroll leads in HubSpot email sequences when they submit or drop off your Surface form - [Step 1: Create HubSpot Form](/guides/email-sequences-hubspot/step-1-hubspot-form): Create a HubSpot form with all fields optional except email so partial Surface submissions can be recorded - [Step 2: Create HubSpot Sequence](/guides/email-sequences-hubspot/step-2-hubspot-sequence): Create a HubSpot sequence with automated emails, personalization tokens, and meeting link - [Step 3: Add Follow-Up Emails and Delays](/guides/email-sequences-hubspot/step-3-follow-up-delays): Add more sequence steps with follow-up emails and business-day delays between each - [Step 4: Add Automation](/guides/email-sequences-hubspot/step-4-automation): Create a HubSpot automation that enrolls contacts in your sequence when they submit the form - [Step 5: Connect HubSpot Form with Surface Workflow](/guides/email-sequences-hubspot/step-5-surface-workflow): Set up a Surface workflow to send form submissions to your HubSpot form so leads get enrolled in your sequence - [Send Data to Clay](/guides/send-data-to-clay): Learn how to send Surface Form submissions to Clay using webhooks and the HTTP Request action