Browse the manual
Background, glass effect and overlay
In short
Put a photo, gradient or colour behind your catalogue, and make the surfaces see through.
Result
A catalogue with your own backdrop and, if you want it, a frosted glass look.
Before you start
- You are on a Pro plan or higher. Plans and what each includes
What this group does
Your theme sets the colours of your page, cards and text. These three settings sit on top of it: a backdrop behind everything, a see through treatment for the surfaces in front of it, and a playful overlay of falling emoji.
All three need a Pro plan or higher. They are in the Appearance tab of the editor panel.
Add a background
Switch on Customize background
Choose a type
Photo, Gradient or Colour. Each type remembers its own choice, so you can switch between them without losing your picks.
Set it up
A gradient is one of twelve tiles. A colour is a hex code, a native colour picker or one of twelve quick picks. A photo is uploaded, with a Fade slider to soften it.
The backdrop appears behind your catalogue straight away in the builder.
Background
- Oat milk
- Peach glow
- Sunset
- Sage
- Meadow
- Sea glass
- Morning sky
- Lavender
- Orchid
- Blush
- Stone
- Mist
Style
Use glass on
Lower lets more of the page show through.
Blur of what's behind, like content scrolling under the navbar. Phones cap it at 20 px.
Light along the edges. Past 16 px it starts to glow.
- Point 1: 1Turn on a custom background; everything below only appears once this is on.
- Point 2: 2Choose a photo, a gradient or a single colour.
- Point 3: 3Pick one of the twelve gradients; the chosen one gets an amber ring.
- Point 4: 4Set how frosted the surfaces are, from Off to Frosted.
- Point 5: 5Choose which surfaces the glass applies to.
- Point 6: 6Open Fine-tune to adjust opacity, frost and splay by hand.
Background type
Default: GradientWhich kind of backdrop to use.
Gradient
Default: Oat milk12 to choose fromSoft two colour washes: Oat milk, Peach glow, Sunset, Sage, Meadow, Sea glass, Morning sky, Lavender, Orchid, Blush, Stone and Mist.
Colour
Default: #f6f1e9A flat colour. Must be a full six digit hex code. The quick picks include four dark options for use with a dark theme.
Photo
Up to 50 MBA PNG, JPG or WebP image. Landscape photos at least 1600 pixels wide look best, and Quicktalog shrinks anything larger in your browser. SVG files are refused.
Fade
Default: 35%0 to 80%Blends the photo into your theme's background colour so text stays readable. Higher means more theme colour and less photo. Only shown for a photo.
Every gradient is light
All twelve gradients are pale, so one behind a dark theme such as Elegant or Modern will clash. With a dark theme, use a flat colour from the dark quick picks, or a photo with a high fade.
Your cards keep their theme colours
A background changes what is behind your content, not the content itself. Cards, section headings and text stay as your theme sets them, unless you also switch on the glass effect.
The glass effect
Glass makes your navbar, search bar, section headings and item cards see through, so the backdrop shows softly behind them. It is under Style in the same tab.
Glass effect
Default: OffHow strong the effect is. Clear is barely there, Frosted is a heavy blur. The value beside the label reads Semi-frosted for the middle setting even though the slider mark says Semi.
Use glass on
Default: All four onWhich surfaces get the effect. Switch the cards off and keep the navbar on for a lighter result. These are greyed out while the effect is Off.
Opacity
20 to 85%Lower lets more of the page show through.
Frost
0 to 40pxHow blurred what is behind becomes. Phones cap this at 20 pixels whatever you set.
Splay
0 to 24pxLight along the edges of each surface. Past 16 pixels it starts to glow.
Glass needs something to show through
On a plain coloured page the effect is almost invisible. Set a photo or a gradient background first, then turn the glass on.
Fine-tuning resets when you change the level
Touching any of the three sliders changes the readout to tuned
and adds a reset link. Moving the main Glass effect slider clears your tuning and goes back to that level's standard numbers.
The overlay
Enable overlay
Default: OffDrops copies of an emoji slowly down the page, for a holiday or a promotion.
Overlay icon
Max 3 emojiThe emoji to fall. Only emoji are accepted, and the field refuses anything else as you type. A counter shows how many you have used.
Good to know
- Customers on a phone get a lighter version of the glass effect, and no blur on item cards at all, so the page stays fast.
- Customers who have asked their device to reduce transparency see nearly solid surfaces instead. The text stays readable either way.
- Quick AI cannot change any of these three. Set them yourself.
- Dropping to a plan below Pro erases your background, your glass settings and your overlay. They are not remembered if you upgrade again.
- A background photo counts as in use, so Quicktalog will not clean it up while your catalogue refers to it.
Messages
What the messages mean3
| What you see | Why | What to do |
|---|---|---|
Upgrade required | You are on a plan below Pro. | Select Upgrade now, or use one of the seven ready made themes, which are on every plan. |
SVG images aren't supported here. Please upload a PNG or JPG. | You tried to use an SVG as a background photo. | Export the image as a JPG, which suits photographs best. |
File is too large. Please select a smaller image | The photo is over 50 MB. | Use a smaller file. Around 1600 pixels wide is plenty. |
What you see
Upgrade required
Why
What to do
What you see
SVG images aren't supported here. Please upload a PNG or JPG.
Why
What to do
What you see
File is too large. Please select a smaller image
Why
What to do
Related pages
- Themes, colours and fontsChange how your catalogue looks, from a ready theme to your own colours.
- Heading, navbar, search and footerSet the title at the top, your own navbar and footer, and a search bar for your customers.
- Plans and what each includesCompare the five plans, and see which limit you are likely to meet first.