Custom CSS

If you're a third-party design partner to style your website, great news — the new CMS Forms module fully supports custom CSS styling! While the form's HTML structure cannot be modified, you can easily apply consistent design using a linked stylesheet.

What You Can CustomizeLink to this section

Forms are rendered using standardized markup and Bootstrap 5 styles, making it easy to style them to match your website. You can:

• Change fonts, colors, spacing, and button styles
• Adjust input field appearance
• Style grouped or read-only elements
• Support responsive layouts
• Override or extend the default form design
  Important: You cannot modify the HTML structure of forms. Styling must be applied via CSS.

CSS Starter FileLink to this section

To help you get started, we've created a CSS starter file that includes recommended selectors, structure, and tips for targeting form elements using data-el attributes.
Download the starter file:
Forms CSS Starter File (Modern Campus)
This file includes:

• Targeting examples for input types, groups, labels, and error messages
• Use of data-el attributes for stable selector targeting
• Bootstrap-friendly defaults

How to Apply the CSSLink to this section

To apply your custom styles:
1. Host your CSS file in your institution’s design folder or public web space.
2. Add the stylesheet URL to the form settings in the CMS:

• Open your form in the CMS.
• Go to the Properties tab.
• Paste the URL of your CSS file in the Custom Stylesheet URL field.
• Save and re-launch the form.

Forms apply your custom styles only on the published/live form view. The CMS Form Builder uses default styles to avoid design conflicts.

Tips for SuccessLink to this section

• Use specific selectors to override default Bootstrap styles cleanly.
• Don’t rely on form HTML — treat the structure as fixed.
• Test live: Preview your form to confirm styles are applying correctly.
• Avoid !important unless absolutely necessary — use specificity instead.
• Consult the starter file for structure guidance and selector patterns.