Embed
Create a Collection
Update Collections
Adding a background image to a Section on a Flow page is a great design idea. But images are often very complex visually and it can be hard to read text over them.
One way to help the text be more readable is to add a background color with a transparency setting to the text. The background helps the text stand out against the image while the transparency means the image can still be seen behind the text, providing an effect of added depth to your page.
In this lesson we’ll add a transparent background color to the Row the text is in, so the background extends across the full width of the background image.
-
1Select the Title element on the page.
Click the continue button:
-
2Select the Container Inspector icon.
Click the continue button:
-
3Select Row.
Click the continue button:
-
4Select the Background Fill option.
Click the continue button:
-
5The Pick a Fill panel opens. The colors on it are set by the Theme. Select the fourth option in the blue column.
Click the continue button:
-
6Select the 80% option for transparency.
Click the continue button:
-
7Select the Container Inspector icon to close its panels.
Click the continue button:
-
8You'll see that the row containing the Title and Subtitle elements has a colored background that is transparent, allowing the background image to be seen through it. You'll also see that the text has changed. The Theme settings detected that the background color won't provide sufficient contrast for the text's original color, so the color has been switched automatically to white.
Click the continue button:








Comments ( 0 )
Sign in to join the discussion.