Collect answers with Forms.

#Before you start

Forms is in the sidebar under Library, in the Workspace section, next to Documents and Templates. Forms is turned on per workspace; if it is not listed under Library, ask us to enable it. Everyone in a workspace with Forms can build forms and read their submissions.

#Step 1: Build the form

Give the questions that identify the person a role (contact email, first name, last name, full name, phone, company name, company website). Steps use roles to find “the email” or “the company” without you wiring each one by hand. Each role can be used by one question per form.

Under form settings you choose the submit button’s label, the thank-you message, and an optional https:// address to send people to afterwards.

#Step 2: Choose what happens on each submission

Email and Slack messages can quote answers with tokens, filled in as plain text so nobody can inject formatting, links or mentions:

Hi {{field.first_name}},

Thanks for getting in touch about **{{field.company}}**. We will reply within one working day.

The {{form.name}} team

{{field.<key>}} is an answer (each question’s key is shown in its settings), {{form.name}} the form’s name, and {{submission.url}} a link to the submission in Revvly.

#Step 3: Publish

Nobody sees your edits until you press Publish. Publishing checks that the form is complete: every step is set up, every token names a real question, the pipeline, stage and people still exist, the mailbox is connected and Revvly can post to the Slack channel. Anything missing is listed so you can fix it.

Each publish is a new version. Submissions keep the version they were made on, so you can rename or remove a question later without losing or mislabelling earlier answers. Archive a form to take it offline; restore it to bring it back.

#Step 4: Share it

<!-- Copy yours from the form's Share tab: it carries your form's id and address. -->
<div data-revvly-form="Xk2mQ8vT1nR4pLw7Za"></div>
<script src="https://<your-revvly-dashboard>/forms-embed.js" async></script>

An embedded form can match your site’s colours, corners and font. See match the embed to your site.

#Match the embed to your site

By default an embedded form is light, with a mint button. To match your site, add data-revvly-* attributes to the same div. The form itself is not changed, so every site that embeds it can dress it differently, and a form with no attributes looks exactly as before. Only embedded forms read them; the hosted link keeps Revvly’s look.

<div
  data-revvly-form="Xk2mQ8vT1nR4pLw7Za"
  data-revvly-theme="dark"
  data-revvly-background="transparent"
  data-revvly-text="#FFFFFF"
  data-revvly-label="#D1D5DB"
  data-revvly-muted="#9CA3AF"
  data-revvly-input-background="#000000"
  data-revvly-input-border="#374151"
  data-revvly-input-focus-border="#4B5563"
  data-revvly-accent="#3B82F6"
  data-revvly-accent-text="#FFFFFF"
  data-revvly-error="#EF4444"
  data-revvly-radius="6"
  data-revvly-button-radius="24"
></div>

data-revvly-theme also takes one JSON object, and a separate attribute wins over the same key in it. Use the JSON form when you would rather keep the theme in one place, and a gradient on the button when a flat colour is not enough.

<div
  data-revvly-form="Xk2mQ8vT1nR4pLw7Za"
  data-revvly-theme='{"scheme":"dark","background":"transparent","accent":"#3B82F6"}'
  data-revvly-button-background="linear-gradient(90deg, #3B82F6, #8B5CF6)"
></div>

Colours are hex, rgb(), hsl() or transparent. Anything that is not in one of those forms is ignored, so a typo leaves that part of the form on its default rather than breaking it.

Ask your coding agent to do it

If a coding agent (Claude Code, Cursor, Lovable and others) adds the form to your site, it should ask you before it restyles anything, and it should read your site’s own colours instead of guessing. Copy this prompt, with your form’s id and dashboard address from its Share tab:

Add my Revvly form to this website with Revvly's embed snippet, then offer to style it.

1. Put this where the form should appear. Use my form's real id and dashboard address, copied from the form's Share tab in Revvly:

<div data-revvly-form="FORM_ID"></div>
<script src="https://REVVLY_DASHBOARD_ADDRESS/forms-embed.js" async></script>

2. Before you finish, ASK ME this, and wait for my answer:
"The embedded form is light with a mint button by default. Do you want it to match this site (colours, corner radius, dark or light), or keep the default?"
Do not restyle the form unless I say yes, and do not guess at colours.
- If I say keep the default, stop here.
- If I say match the site, read this site's stylesheet or design tokens and find: the page background, the text colour, the input border colour, the accent (primary button) colour, the text colour on that button, the error colour, the corner radius of inputs and of buttons, and the font. Show me what you found as a short list and ask me to confirm or change each value before you use it.

3. Add the confirmed values to the same <div> as data-revvly-* attributes. Only these attributes exist, so do not invent others:
- data-revvly-theme: "dark" or "light" (light is the default). Set it to match the page behind the form.
- data-revvly-background: the page behind the form, or "transparent" so the form sits directly on this site's own background.
- data-revvly-card: the form's own surface. Leave it out for no card.
- data-revvly-text, data-revvly-label, data-revvly-muted: title and answers, field labels, and help text plus placeholders.
- data-revvly-input-background, data-revvly-input-border, data-revvly-input-focus-border.
- data-revvly-accent: the submit button, focus ring, links and selected options. data-revvly-accent-text: the text on the button.
- data-revvly-button-background: use only when the button is not a flat accent, as a colour or a linear-gradient(...) of colour stops.
- data-revvly-error, data-revvly-radius (inputs, in pixels), data-revvly-button-radius (the button, in pixels).
- data-revvly-font: a font family the visitor's device already has, such as "Inter, system-ui, sans-serif". The form runs in its own frame and cannot load this site's font files, so tell me if the site uses a webfont.
Values must be hex, rgb(), hsl() or "transparent" for colours, and plain numbers for radii. Anything else is ignored. Set data-revvly-theme to "dark" whenever the page behind the form is dark, even if I did not mention it.

4. Check the result in a browser: the form has no white box on a dark page, text is readable against its background, error text is visible, and the submit button label is readable. Tell me what you changed and which values came from the site and which from me.

For a form that is already on your site, use this shorter one. It asks the same question first and changes only the attributes:

My website already embeds a Revvly form (a <div data-revvly-form="..."> followed by the forms-embed.js script). Help me change how it looks.

First ask me: "Do you want the form to follow this site's colours and corner radius, a specific palette you will give me, or keep the default look?" Wait for the answer. If it is the default, change nothing.

Then set data-revvly-* attributes on that <div>, without touching the script tag or the form itself: data-revvly-theme ("dark" or "light"), data-revvly-background (a colour or "transparent"), data-revvly-text, data-revvly-label, data-revvly-muted, data-revvly-input-background, data-revvly-input-border, data-revvly-input-focus-border, data-revvly-accent, data-revvly-accent-text, data-revvly-button-background (colour or linear-gradient), data-revvly-error, data-revvly-radius, data-revvly-button-radius, data-revvly-font. Show me the values before applying them. If something does not change, check the value is a hex, rgb(), hsl() or "transparent" colour, because anything else is ignored.

If you write your own agent instructions, keep the question: whether to keep the default look or match the site is the customer’s choice, and a form that silently takes on guessed colours is harder to undo than one that asked.

#Step 5: Read the submissions

#Send a form to a client

A form can also collect details from one client or prospect you already know: their billing address, who receives invoices, who signs the contract. You build it like any other form, then send that client a link made for them alone. Their answers come back to the record’s Forms tab, where you decide what to copy onto the record.

#Spam and limits

1. Every form carries an invisible spam trap. A bot that fills it sees the normal thank-you message, and nothing is stored or sent.
2. Each form takes up to 1,000 submissions a day from its link, embed and your own site, and a separate 10,000 a day through the API, so a flood on the public form cannot block your backend. Past the limit, submissions are refused until the next day (UTC).
3. Each visitor can submit up to 30 times a minute; more is refused for a minute.
4. Uploaded files are checked for their real type and scanned for viruses before they are kept. Files that are never submitted are deleted after a day.
5. Visitors’ IP addresses are never stored, only a keyed fingerprint used to spot abuse.

#Before you go live

1. Submit the published form once yourself and check every step in its log.
2. The questions that identify the person have roles, and the email question is required if you create leads or reply to the submitter.
3. The Slack channel and the mailbox you send from are the ones you expect.
4. If you embed the form on a dark or branded page, it is themed to match and you looked at it on a phone. See match the embed to your site.
5. Links in your campaigns carry the parameters your hidden values read.
6. If you send the form to clients, its client fields are set, you opened a test link yourself and saw it filled with the record’s details, and you chose whether it should open only through client links. See send a form to a client.
7. If you collect personal data, the form has a consent checkbox or a paragraph pointing to your privacy notice.

Related

• Forms API reference ›
• Run your sales pipeline ›
• Configure integration API keys ›