Overwrite the global styling theme for individual surveys to create unique styles for each survey.
To set a styling theme for all surveys, please see the Styling Theme manual.

​
Overwrite Styling Theme

  1. In the Survey Editor of the survey you want to style, navigate to the Styling tab: Styling tab in survey editor
  2. Activate the Add Custom Styles toggle to override the default project styling: Add Custom Styles toggle />
  3. Customize your survey’s style as needed: Custom styling options
Just hit the Save button to apply your changes. Your survey is now ready to impress with its unique look!

​
Overwrite CSS Styles for App & Website Surveys

You can overwrite the default CSS styles for app and website surveys by adding the following CSS to your global CSS file (e.g., globals.css): Do not change the CSS variable names, as Formbricks uses them to identify styling elements. You can adjust the values to fit your design. Below are sample values for reference: 
/* Overwrite Formbricks default styles */
--fb-brand-color: red;
--fb-brand-text-color: white;
--fb-border-color: green;
--fb-border-color-highlight: rgb(13, 13, 12);
--fb-focus-color: red;
--fb-heading-color: yellow;
--fb-subheading-color: green;
--fb-info-text-color: orange;
--fb-signature-text-color: blue;
--fb-survey-background-color: black;
--fb-accent-background-color: rgb(13, 13, 12);
--fb-accent-background-color-selected: red;
--fb-placeholder-color: white;
--fb-rating-fill: rgb(13, 13, 12);
--fb-rating-hover: green;
--fb-back-btn-border: blue;
--fb-submit-btn-border: transparent;
--fb-rating-selected: black;
Check out an example in our Demo project. Funky Survey Examples Super Mario “I guess he won’t let himself be limited by radio buttons and do all three things!” Super Mario survey example Hipster Living “Does your monstera get enough water?” Hipster Living survey example Windows XP “Hach, nostalgia. It made us want to play Mafia.” Windows XP survey example Who’s a Good Boy? “Things you’ve likely said to your dog.” Dog-themed survey example

​
Fixes & Improvements:

  • Numbered list formatting: Fixed numbering issues.
  • Consistent image alt text: Updated descriptions for clarity.
  • CSS syntax correction: Removed unnecessary text before code block.
  • Grammar & punctuation fixes: Ensured clarity and smooth readability.
This should now display correctly on Mintlify! Let me know if you need further tweaks.