FormLint for Framer

Connect from the Framer editor.

Editor plugin · developer install. Download includes installation instructions and license notices. These packages are distributed directly by FormLint; no platform endorsement or marketplace approval is claimed.

1. Run the downloaded project.Extract the ZIP, open its directory, use Node 24 and run npm install, then npm run dev. It serves only on local HTTPS port 5173; see the README for local certificate setup.
2. Open it in Framer.Enable Developer Tools in Framer’s plugin preferences, then use Open Development Plugin. Follow Framer’s development guide.
3. Install the connection.Enter your FormLint site origin, evaluation endpoint, public key and mapping. Opt in to processing and select Install / replace connection. Publish your site from Framer when ready.

The plugin uses Framer’s custom-code API. It changes its own snippet only and does not publish your website. Read-only collaborators cannot install; a disabled snippet must be enabled in site settings.

Match your fields. Keep their native names.

Create or choose your FormLint project, save its rules and field IDs, and create a public key. Use your HTTPS evaluation endpoint ending in /evaluate. Keep provider and server secrets out of every plugin.

Add the exact origin where the form runs to the project’s allowed origins. Include your staging origin separately when testing.

Map the project field ID description to the exact Name of your Framer input, such as Brief. Use a native Framer form, not a third-party iframe.

The default form selector form requires exactly one native form on the page. For multiple forms, inspect the published HTML and enter a stable CSS selector matching only the intended form. Suggestions run on the published page, not the editing canvas.

Your rules live in FormLint.

Write your checks and visitor messages in the project and save. For a packaging brief, check quantity and dimensions with separate rules, each with its own suggestion. For quantity, use “Add how many items you need.” Learn how to write useful rules.

Map up to four non-sensitive fields, at most 4,000 characters each: native textarea, text, number, single select or individual checkbox. Files, custom choice widgets, grouped controls and sensitive input types are excluded. The integration does not read browser storage or keep answers across form pages; use rules whose mapped fields appear together.

Widget language

Choose Auto, English or Italiano in the integration settings. Auto follows the form document’s HTML language, including runtime changes. Add all rule translations and choose the default language in FormLint’s Form setup. Missing or unsupported translations use the project default for every message.

If your custom switcher does not update the page’s HTML language, call setLocale on the integration instance. Switching existing feedback does not consume another evaluation. Language setup and SDK examples.

Test the whole form.

• Confirm feedback is hidden on load and appears below the mapped field after an edit.
• Try incomplete and complete synthetic examples. Simulated mode recognizes supported fixtures only; arbitrary text can return unavailable.
• Check that the selector matches exactly one form and each mapped selector one supported input. Missing suggestions usually mean a mapping, origin, key or endpoint mismatch.
• Test AJAX refreshes, popups and navigation. Replaced inputs reconnect; previous requests are discarded.
• Disable the evaluation endpoint and submit. The original submission must still work.

To disconnect, use Remove connection in the editor plugin, then republish your site. Reinstalling replaces the entire connection; re-enter all fields to retain.