How to Convert a Google Form to HTML (and Style It Your Way)

Google Forms has no HTML export, and its embed code is an iframe your CSS cannot touch. To get a form that looks like your site you have three options: live with the iframe, hand-build an HTML form that posts to Google's undocumented formResponse URL, or rebuild the form as real HTML that posts to a form backend. The third is the only one that gives you full styling, spam protection, and a confirmation you control. Our free Google Forms to HTML converter does that rebuild from a link in a few seconds.

Full disclosure: the converter and the backend it points at are ours. The other two options are described as fairly as we can, including the one case where the unofficial Google route is the right call.

Why a Google Form can't just be restyled

The embed snippet Google gives you is an <iframe> pointing at docs.google.com. Browsers isolate iframe content from the parent page, so your stylesheet never reaches the form inside it. What you can change is limited to Google's theme panel: a header image, one color, and a short list of fonts. Everything else is fixed:

• Google's layout, spacing, and input styles
• The "Submit" button and the Google-branded confirmation screen
• A fixed iframe height, which means a scrollbar inside your page on mobile
• The "never submit passwords through Google Forms" footer

For an internal survey none of that matters. On a marketing site or a portfolio it is the one block that visibly belongs to someone else.

The three options, side by side

Option 1: keep the iframe

Paste Google's embed code and move on. This is the right answer when the form is internal, temporary, or when you depend on Google-only features such as quizzes with grading, section branching, or response limits tied to Google sign-in. Nothing else on this page replaces those.

Option 2: your own HTML, posting to Google

Every Google Form accepts submissions at a formResponse URL, and every question has an entry ID. If you build an HTML form whose field names are those IDs, Google will record the submission as if it came from the real form:

<form
  action="https://docs.google.com/forms/d/e/YOUR_FORM_ID/formResponse"
  method="POST"
  target="hidden_iframe"
>
  <input type="text" name="entry.1277095329" required />
  <button type="submit">Send</button>
</form>
<iframe name="hidden_iframe" style="display:none"></iframe>

It works, responses keep landing in your linked Sheet, and it costs nothing. That is the honest case for it. The costs are real, though:

• You cannot tell whether it worked. A normal submit navigates to Google's confirmation page, so people hide it in an iframe or use fetch with mode: "no-cors". Either way the response is unreadable, so your "Thanks!" message appears even when Google rejected the submission.
• There is no spam protection. Google's bot defenses sit on its own form page, which you have bypassed. Your endpoint is a public URL anyone can script.
• It is undocumented. Entry IDs are found by reading the page source, and Google can change the mechanism without notice. Forms that require sign-in, collect verified emails, or accept file uploads do not work this way at all.
• Validation lives only in your markup. Anything posted directly skips it.

Choose this when the Sheet is the whole point, the form is low-stakes, and a silently lost submission would not hurt.

Option 3: convert the form to HTML and post it to a form backend

This keeps what you wanted from Google Forms (a quick way to define questions) and replaces the parts that fight your site. The form becomes plain HTML you own; submissions go to an endpoint that stores them, filters spam, emails you, and tells the page whether it succeeded.

Step 1: paste the link into the converter

Open the Google Forms to HTML converter and paste the link you share with respondents (docs.google.com/forms/… or forms.gle/…). The form has to open without a Google sign-in. The converter reads the question definitions from the public page once and stores nothing; it never sees your responses.

Step 2: check the imported fields

Each question becomes an editable field with the same label, options, and required setting:

Field names are derived from the question text (which_plan_do_you_need), so your submissions are readable rather than keyed by entry.995005981.

Step 3: style it and copy the code

Pick plain CSS, Tailwind classes, or unstyled markup that inherits your site's own form styles, then copy the HTML. The same form is available as React, Vue, Svelte, and Astro components. A typical result:

<form action="https://shipmyform.com/f/YOUR_FORM_ID" method="POST">
  <label>
    <span>Your name *</span>
    <input type="text" name="your_name" required />
  </label>
  <fieldset>
    <legend>Which plan do you need? *</legend>
    <label><input type="radio" name="which_plan_do_you_need" value="Starter" required /> Starter</label>
    <label><input type="radio" name="which_plan_do_you_need" value="Team" required /> Team</label>
  </fieldset>
  <!-- Anti-spam honeypot, leave this empty -->
  <input type="text" name="_gotcha" tabindex="-1" autocomplete="off" style="position:absolute;left:-9999px" />
  <button type="submit">Submit</button>
</form>

Step 4: connect the endpoint

Create a free ShipMyForm form, put its ID in the action, and deploy. The free plan covers 100 submissions a month with spam filtering, an inbox, email notifications, and CSV export.

What you lose by leaving Google Forms

Be clear-eyed about it. A converted form does not carry over quiz grading, answer-based section branching (sections themselves become form steps), response limits by Google account, or Google's response charts. Past responses stay in your old Sheet. And the converter reads an undocumented page format, so if Google changes it, imports can fail until we update the parser. Your already-converted form is unaffected, because it no longer depends on Google at all.

Which option should you pick?

• Internal survey, quiz, or anything using branching → keep the iframe.
• Low-stakes form where the Sheet is everything and you will not pay or sign up for anything → the formResponse route, knowing submissions can fail silently.
• A form on a public site that has to look right and reliably reach you → convert it and post it to a form backend.

If you are starting from nothing rather than from an existing Google Form, the contact form generator builds the same kind of markup from a template.