Backgrounds

The background is part of the form’s theme and fills the page behind each question card. Three types are available: solid, gradient, and image. Open the Design tab in the studio and look for the Background section to configure it.

Solid

A single flat colour fills the entire background.

Setting	Default	Notes
`color`	`#ffffff`	Any CSS hex colour

This is the simplest option and works well for clean, minimal forms.

Gradient

A colour gradient fills the background. Two gradient styles are available.

Linear gradient

A gradient that transitions in a straight line across the background.

Setting	Notes
`rotation`	Angle in degrees (0 = top-to-bottom, 90 = left-to-right)
`colorStops`	Array of colour + position pairs (e.g. `#6d28d9` at `0%`, `#3b82f6` at `100%`)

You can add as many colour stops as you like. Drag them to reorder or adjust positions. Example: A purple-to-blue diagonal gradient:

rotation: 135°
stops:
  #7c3aed  0%
  #3b82f6  100%

Radial gradient

A gradient that radiates outward from a central point.

Setting	Notes
`radius`	Size of the inner circle as a percentage of the container
`colorStops`	Same format as linear — inner colour first, outer colour last

Radial gradients work well for spotlight-style forms or soft vignette backgrounds.

Image

A custom image fills the background.

Setting	Default	Notes
`url`	—	Upload or provide a URL to your image
`size`	`cover`	`cover` (fill, may crop) · `contain` (fit, may letterbox) · `auto` (natural size)
`repeat`	`no-repeat`	`no-repeat` · `repeat` · `repeat-x` · `repeat-y`
`position`	`center`	CSS background-position value (e.g. `center`, `top left`, `50% 20%`)

For best results use an image at least 1920 × 1080 px. Very large images increase load time. Compress images to under 500 KB when possible.

When using a dark or busy image background, check that the surface colour (set in the theme) provides enough contrast for question cards to remain readable. Consider using a semi-transparent surface or a lighter surface colour.

Choosing between types

Use case	Recommended type
Clean, corporate look	Solid white or light grey
Brand-forward, vibrant form	Linear gradient
Soft, premium feel	Radial gradient
Photo survey or immersive experience	Image

Overview

Building Forms

Content

Question Types

Workflow & Logic

Design

Security & Access

Sharing & Embedding

Results & Analytics

Solid

Gradient

Linear gradient

Radial gradient

Image

Choosing between types

Next steps

Themes

Branding

​Solid

​Gradient

​Linear gradient

​Radial gradient

​Image

​Choosing between types

​Next steps

Themes

Branding

Solid

Gradient

Linear gradient

Radial gradient

Image

Choosing between types

Next steps