Brand Your Survey Header

Edit in →
Survey Creator

Make your surveys look great and stand out with your brand's own design language. Create a custom survey title, description, and logo for your survey header to make the entire form look more professional and increase brand recognition. This demo shows how to add a survey title, description, and your company logo to the survey header. Read more...

Settings Themes
Color palette
Question appearance
Sorry, we can't retrieve the data from server. Please comeback later.

Make your surveys look great and stand out with your brand's own design language. Create a custom survey title, description, and logo for your survey header to make the entire form look more professional and increase brand recognition. This demo shows how to add a survey title, description, and your company logo to the survey header.

Add a Title and Description to the Survey Header

To add a short survey title, assign it to SurveyModel's title property. You can also display a longer survey description under the title. Use the description property to specify description text.

If you need to specify title visibility, use the Boolean showTitle property. Note that this property also specifies description visibility because a description cannot be displayed without a title. Click the "Show survey title" checkbox to show or hide the survey title and description in this demo.

Add Your Logo to the Survey Header

To add your logo to the survey header, assign an image URL or a Base64-encoded image to SurveyModel's logo property. You can use the logoWidth and logoHeight properties to specify logo dimensions. In this demo, you can use the "Logo width" and "Logo height" settings to change the logoWidth and logoHeight property values.

A logo image is positioned on the left side of the survey title. If you want to move it to the right side, set the logoPosition property to "right". The same property can be set to "none" if you want to hide your logo. This demo allows you to change the logoPosition property at runtime.

A logo can be automatically resized to fit into its container. Set the logoFit property to specify the mode used to resize the logo: "contain" (default), "cover", "fill", or "none". Refer to the object-fit CSS property description on MDN for more information. Use the "Logo fit" drop-down menu to test these modes in this demo.

Why we use cookies.

This site uses cookies to make your browsing experience more convenient and personal. Cookies store useful information on your computer to help us improve the efficiency and relevance of our site for you. In some cases, they are essential to making the site work properly. By accessing this site, you consent to the use of cookies.

For more information, refer to DevSoft Baltic’ Terms of Use & Privacy Statement.

Your renewal subscription expires soon.

Since the license is perpetual, you will still have permanent access to the product versions released within the first 12 month of the original purchase date.

If you wish to continue receiving technical support from our Help Desk specialists and maintain access to the latest product updates, make sure to renew your subscription by clicking the "Renew" button below.

Your renewal subscription has expired.

Since the license is perpetual, you will still have permanent access to the product versions released within the first 12 month of the original purchase date.

If you wish to continue receiving technical support from our Help Desk specialists and maintain access to the latest product updates, make sure to renew your subscription by clicking the "Renew" button below.