How to Inject CSS Codes to Widgets

December 7, 2023

In Jotform Form Builder, you can inject custom CSS codes to customize your form. The same can be done to widgets. Widgets need to have their own option for CSS injection since they reside in their own respective iframes and are restricted by the same-origin policy. The same-origin policy restricts how a document or script loaded from one origin can interact with a resource from another origin.


This feature is only available to Classic forms. For more information, see Cards or Classic: Which One Should I Use?

To add CSS to a widget

  1. In the Form Builder, select the widget’s wand icon to open settings.
  2. In the settings panel on the right, go to Custom CSS at the top.
  3. Enter your CSS code in the textarea.
  4. Select Update Widget at the bottom to save the changes.
Steps to add custom CSS to a widget
Save 50%


Offer does not apply to Jotform Enterprise

Contact Support:

Our customer support team is available 24/7 and our average response time is between one to two hours.
Our team can be contacted via:

Support Forum:

Contact Jotform Support:

Send Comment:

Jotform Avatar
This site is protected by reCAPTCHA and the Google Privacy Policy and Terms of Service apply.


  • John Russell - Profile picture
  • Aaron Walsh - Profile picture
  • Florida Gourd Society - Profile picture
  • Ezp - Profile picture
  • Virtual Studio - Profile picture
  • Gretchen k Nielsen - Profile picture
  • Andrew J Scott - Profile picture
  • jtr takhassusat - Profile picture
  • plinx100 - Profile picture
  • easymovegta - Profile picture
  • bbcle - Profile picture
  • Katie Classon - Profile picture
  • Dannoriffo - Profile picture
  • arizonacoalition - Profile picture
  • kamuzu101 - Profile picture
  • AZDBAdesze - Profile picture
  • laniraflar - Profile picture
  • akkdio - Profile picture
  • BMS_Admin - Profile picture
  • Stewardly - Profile picture
  • Jay Hobbs - Profile picture
  • usman1205 - Profile picture
  • floorcosts - Profile picture