To present stories with an appealing background, you can use the following layers
Image
Video
Color
Gradient
ShadingShade
Divider
...
By combining these layers you can design your story background. For example, it is possible to add a color or a gradient with transparency over a background image. This allows you to better highlight text on a bumpy background or colorize entire images. The color palette is predefined by the theme. Therefore, the story remains color-matched and will automatically adopt the new colors when the theme is changed.
...
Below you can view several gradients:
...
Shade
...
A shading is also a gradient. Start color is the selected color, end color is the full transparency of it. Shading
...
Divider
...
is primarily used to lighten or darken backgrounds, thereby making text more legible on bumpy backgrounds.
Below you can see a white shading from right to left to make the dark text more visible on the dark, bumpy background.
...
Similar to the gradients, the following options are available:
Color: Determines the shading color.
Type: You can choose between two types: linear and radial.
Direction: Determines in which direction the shading should run. In addition, you can decide between a linear or radial course.
Start Position: Controls where the gradient starts (in % ).
End Position: Controls where the gradient ends (in % ).
Opacity: Determines the transparency. 1 = no transparency, 0 = 100% transparency.
Flip: Mirrors the image horizontally or vertically or both in combination.
CSS Class: Allows inserting additional CSS classes for the element.
CSS Style: Allows inserting inline CSS for the element.
Below you can view several gradients
Image 1 linear gradient: Color: "Warning to Matched Hue".
Divider
...
Dividers are used to graphically separate or connect the bottom or top of the story to the following or preceding story.
Following options are available:
Style: Library of graphic separator shapes.
Fill Color: Fill color of the shape. For a smooth transition, select the background color of the neighbor section (Story)
Height: Height of divider as CSS size unit.
Min. Height: Minimum height of divider shape as CSS size unit.
Max. Height: Maximum height of divider shape as CSS size unit.
Opacity: Determines the transparency. 1 = no transparency, 0 = 100% transparency.
Flip: Mirrors the image horizontally or vertically or both in combination.
CSS Class: Allows inserting additional CSS classes for the element.
CSS Style: Allows inserting inline CSS for the element.