Portal forms

Portal forms

In a nutshell

Portal forms are Creator-managed authentication elements that handle user sign-in, sign-up, password creation, and password reset flows within a portal. You can place the appropriate form on its portal page and style its visual areas to match your brand.

1. Overview

Portal forms are a set of four built-in authentication elements, each designed to handle a specific step in a portal user's account lifecycle. They are placed directly onto portal pages to collect credentials, register new users, and manage password flows. The form's fields, labels, placeholders, navigational links, and the authentication logic that runs on portal form submission are all preset and cannot be modified. The portal page designer controls only the visual presentation, that is, how the form looks on the portal page, and not how it behaves.


Each of the four form types serves a distinct purpose and is intended for a specific default portal page:
  1. Sign In - Allows an existing portal user to authenticate and enter the portal
  2. Sign Up - Allows a new user to register for portal access
  3. Set Password - Enables a user to create or replace their password through the platform-managed password flow
  4. Reset Password - Initiates the platform-managed recovery flow for a user who has forgotten their password.

Ideal for:

  1. Portal pages that require user authentication
  2. Onboarding flows where new portal users register or set up their account
  3. Pages where portal users recover access to their account

2. Display properties

Portal forms do not have an admin-configurable data source or field configuration. The form's content, authentication logic, validation, and submission behavior are preset and cannot be modified.

Property Description
Element Name The internal identifier for each Portal Form element. This name is auto-generated on placing within the designer and can be customized as required.

3. Styling properties

Each form type exposes styling controls organized by the area of the form they affect. These controls apply visual changes to the corresponding areas without making the content of those areas editable. The common properties are:

  1. Alignment *link*
  2. Layout *link*
Apart from the above properties, there are a few more styling properties unique to each layer of the portal form that allows full control over its design.
  1. Container
    1. Background color *link*
    2. Padding *link*
    3. Margin*link*
    4. Corner Radius *link*
    5. Border *link*
    6. Shadow *link*
  1. Text
    1. Font *link*
    2. Title and body color*link*
  1. Field Input
    1. Background color
    2. Border color
    3. Placeholder font color
    4. Input's value color
  1. Button
    1. Font color
    2. Background color
    3. Border color
    4. Link color
NotesNote: The Links styling section does not appear on Set Password Form and Reset Password Form as these form types do not include preset navigational links.

4. Try it yourself

Add a Sign In Form and try the following:

  1. Set a Container background color and Container shadow at Elevation 2 to make the form appear as a floating card on the page.
  2. Change the Field Input background color and Field Input border color to match a brand palette and observe how the input fields update in the preview.
  3. Apply a Corner Radius of 12px for a softer card appearance.
  4. Set the Button background color to the brand's primary color and the Button text color to white to make the sign-in action prominent.
  5. Set the Links color to a muted brand-aligned tone so the "Forgot password?" link is visible but does not compete visually with the primary action.

5. Points to note

  1. Each portal form type belongs on its corresponding default portal page. Ensure to place a portal form on the relevant page to produce the intended authentication flow.
  1. Configuring and managing portal pages *link*