Docs
Switch to Classic Editor docs Switch to Beta Editor docs
You are currently viewing the new Beta Editor Docs.
Switch to the Classic Editor Docs
You are currently viewing the Classic Editor Docs.
Switch to the Beta Editor Docs

Custom HTML Forms

This feature is optional - you do not need to know HTML to use Anvil!

However, if you do know HTML, or employ a web designer who does, this reference will allow you or them to create a beautiful template into which you can easily drag-and-drop your Anvil components.

When adding a Form to your Anvil app, you have a choice of styles to choose from. The exact choices depend on which theme you chose, but there is always the option to add a Custom HTML Form:

Create a new form

Create a new form

Editing Custom HTML

You can set the raw HTML of a Custom HTML form to anything you like by clicking the ‘Edit’ button in the Properties Panel

Edit custom HTML

Edit custom HTML

This will open the HTML Editor at the bottom of the Form Editor, and you can expand the panel by clicking the separator bar:

Edit custom HTML

Edit custom HTML

This will open the HTML Editor to the right of the Form Editor:

Edit custom HTML

Edit custom HTML

As you edit the HTML, you will see the changes appear live in the Form Editor. You can designate slots in the HTML to support dragging and dropping new components into your custom Form - see Custom HTML Templates for details.

Tips

You can include any custom HTML you like into your form, including <script> and <style> tags, but if you are including third-party scripts then you should probably be using the Native Libraries feature to ensure they are loaded at the right time. For custom styles, you may prefer to edit the main style of your app instead.

Custom HTML Templates

On This Page: