> ## Documentation Index
> Fetch the complete documentation index at: https://docs.feedbackflowhq.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Styling Theme

> Keep the survey styling consistent over all surveys with a Styling Theme. Customize the colors, fonts, and other styling options to match your brand's aesthetic.

Keep the survey styling consistent over all surveys with a Styling Theme. Customize the colors, fonts, and other styling options to match your brand's aesthetic.

## Configuration

In the left side bar, you find the `Configuration` page. On this page you find the `Look & Feel` section:

<img src="https://mintcdn.com/fiscalo/SwEMXsdLVsfz0ZXb/images/xm-and-surveys/core-features/styling-theme/look-and-feel.webp?fit=max&auto=format&n=SwEMXsdLVsfz0ZXb&q=85&s=a834e338376422f6d5d5ecfd1fcc4365" alt="Look & Feel" width="2840" height="1908" data-path="images/xm-and-surveys/core-features/styling-theme/look-and-feel.webp" />

/>

## **Styling Options**

1. **Form Styling:** Customize the survey card using the following settings

<img src="https://mintcdn.com/fiscalo/SwEMXsdLVsfz0ZXb/images/xm-and-surveys/core-features/styling-theme/form-settings.webp?fit=max&auto=format&n=SwEMXsdLVsfz0ZXb&q=85&s=1e385f77831180a0c294d77c64a1a29f" alt="Form styling options UI" width="2286" height="1494" data-path="images/xm-and-surveys/core-features/styling-theme/form-settings.webp" />

* **Brand Color**: Sets the primary color tone of the survey.
* **Text Color**: This is a single color scheme that will be used across to display all the text on your survey. Ensures all text is readable against the background.
* **Input Color:** Alters the border color of input fields.
* **Input Border Color**: This is the color of the border of the form input field.

2. **Card Styling:** Adjust the look of the survey card

<img src="https://mintcdn.com/fiscalo/SwEMXsdLVsfz0ZXb/images/xm-and-surveys/core-features/styling-theme/card-settings.webp?fit=max&auto=format&n=SwEMXsdLVsfz0ZXb&q=85&s=a56476e496c5ecb583d45ccc96f32552" alt="Card styling options UI" width="2282" height="1766" data-path="images/xm-and-surveys/core-features/styling-theme/card-settings.webp" />

* **Roundness**: Adjusts the corner roundness of the survey card and its components (including input boxes, buttons).
* **Card Background Color**: Sets the card's main background color.
* **Card Border Color**: Changes the border color of the card
* **Card Shadow Color**: Adds a shadow effect for depth
* **Hide Progress Bar**: Optionally remove the progress bar to simplify the survey experience
* **Add Highlight Border**: Adds a distinct border for emphasis.

3. **Background Styling**: Customize the survey background with static colors, animations, or images (upload your own or get from Unsplash)

<Note>This is only available for Link Surveys</Note>

<img src="https://mintcdn.com/fiscalo/SwEMXsdLVsfz0ZXb/images/xm-and-surveys/core-features/styling-theme/background-settings.webp?fit=max&auto=format&n=SwEMXsdLVsfz0ZXb&q=85&s=d74f4771894b76ca866c48acdf54a42e" alt="Background styling options UI" width="2278" height="1572" data-path="images/xm-and-surveys/core-features/styling-theme/background-settings.webp" />

* **Color**: Pick any color for the background
* **Animation**: Add dynamic animations to enhance user experience..
* **Upload**: Use a custom uploaded image for a personalized touch
* Image: Choose from Unsplash's extensive gallery. Note that these images will have a link and mention of the author & Unsplash on the bottom right to give them the credit for their awesome work!
* **Background Overlay**: Adjust the background's opacity

## Add Brand Logo

Customize your survey with your brand's logo.

<Note>Brand logos are only visible on Link Survey pages.</Note>

1. In the Look & Feel page itself in Project settings, scroll down to see the Logo Upload box.

<img src="https://mintcdn.com/fiscalo/SwEMXsdLVsfz0ZXb/images/xm-and-surveys/core-features/styling-theme/step-four.webp?fit=max&auto=format&n=SwEMXsdLVsfz0ZXb&q=85&s=531925f633f6f5d96db13615cd1c6dad" alt="Choose a link survey template" width="1021" height="358" data-path="images/xm-and-surveys/core-features/styling-theme/step-four.webp" />

2. Upload your logo

<img src="https://mintcdn.com/fiscalo/SwEMXsdLVsfz0ZXb/images/xm-and-surveys/core-features/styling-theme/step-five.webp?fit=max&auto=format&n=SwEMXsdLVsfz0ZXb&q=85&s=7e91075e8e8fda76cad633e03c924bb2" alt="Choose a link survey template" width="963" height="409" data-path="images/xm-and-surveys/core-features/styling-theme/step-five.webp" />

3. Add a background color: If you’ve uploaded a transparent image and want to add background to it, enable this toggle and select the color of your choice.

<img src="https://mintcdn.com/fiscalo/SwEMXsdLVsfz0ZXb/images/xm-and-surveys/core-features/styling-theme/step-six.webp?fit=max&auto=format&n=SwEMXsdLVsfz0ZXb&q=85&s=d9ff0e5155586d625ce01f682a0aef35" alt="Choose a link survey template" width="961" height="485" data-path="images/xm-and-surveys/core-features/styling-theme/step-six.webp" />

4. Remember to save your changes!

<img src="https://mintcdn.com/fiscalo/SwEMXsdLVsfz0ZXb/images/xm-and-surveys/core-features/styling-theme/step-seven.webp?fit=max&auto=format&n=SwEMXsdLVsfz0ZXb&q=85&s=e4e9b005c6cadb02a8c7c698335926d0" alt="Choose a link survey template" width="1176" height="636" data-path="images/xm-and-surveys/core-features/styling-theme/step-seven.webp" />

<Note>The logo settings apply across all Link Surveys pages.</Note>

## Overwrite Styling Theme

You can allow to overwrite the styling theme for individual surveys to create unique styles for each survey:

<img src="https://mintcdn.com/fiscalo/SwEMXsdLVsfz0ZXb/images/xm-and-surveys/core-features/styling-theme/allow-overwrite.webp?fit=max&auto=format&n=SwEMXsdLVsfz0ZXb&q=85&s=5373e4c5597ee1d5003a6097cd69263d" alt="Choose a link survey template" width="1590" height="608" data-path="images/xm-and-surveys/core-features/styling-theme/allow-overwrite.webp" />

In the survey editor, a tab called `Styling` will appear. Here you can overwrite the default styling theme.

***
