Rubric Documentation

Form Styles

Fields for styling a form.

  • Heading _[Group]
    _Only applies to the Form Heading group. Rich Text in the form itself should be styled in the form editor.
  • Multistep Progress Bar [Group]
    • Line [Group]
      • Color [Color]
      • Height [Number]
    • Steps Dot [Group]
      • Size [Number]
      • Radius [Number]
      • Background Color (Current/Previous) [Color]
      • Border (Current/Previous) [Border]
      • Background Color (Next) [Color]
      • Border (Next) [Border]
    • Steps Label [Group]
    • Spacing [Spacing]
  • Fields (Global) [Group]
  • Single Line Fields _[Group]
    _Text, number, dropdown, file, upload, and date fields.
    • Height [Number]
  • Multi-line Fields _[Group]
    _
    • Height [Number]
  • Choice Fields _[Group]
    _Checkboxes and radio inputs.
    • Height [Number]
    • Box Styles [Common Module Fields]
  • Select Arrow [Group]
    • Color [Color]
    • Size [Number]
  • File Upload Button [Group]
  • Legal Text [Group]
    • Font Styles [Common Module Fields]
    • Checkbox/Radio Size [Number]
  • Errors [Group]
  • Submit Button [Group]
  • Box  Styles [Common Module Fields]

Using Form Styles in Your HubSpot Pages

The Form Styles module group provides comprehensive styling control for HubSpot forms embedded in your Rubric theme pages. These styling options work with any HubSpot form you’ve created in your Marketing Hub, allowing you to seamlessly integrate forms with your site’s design without compromising the professional, educational aesthetic that Rubric is known for.

When you add a form to any page using the HubSpot page editor, you can access these styling controls through the module settings panel on the left sidebar. The Form Styles options are particularly valuable for education institutions and event organizers who frequently use multi-step registration forms, course enrollment forms, or complex contact forms with multiple field types.

The Multistep Progress Bar styling is especially useful for lengthy application processes or detailed registration forms common in educational settings. You can customize the visual progression indicators to match your institution’s brand colors and ensure users understand their progress through the form completion process.

For choice fields and file upload buttons, the styling options help maintain consistency with your site’s overall design language. This is crucial when you’re collecting documents like transcripts, resumes, or event materials where the upload experience needs to feel professional and trustworthy.

Best practice tip: Use the Global Fields styling first to establish your baseline form appearance, then customize specific field types as needed. The Legal Text styling options are particularly important for GDPR compliance and institutional privacy requirements that educational sites frequently need to address.

Remember that while these options control the visual presentation, your actual form logic and field requirements are still managed in the HubSpot Forms tool within your Marketing Hub.