Embed
Embed: preview
Embed size:
Maintain aspect ratio
Show steps
Embed code
Create a Collection
Update Collections
Create a
Collection
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.
00:00 Select the Title element on the page.
00:04 Select the Container Inspector icon.
00:08 Select Row.
00:12 Select the Background Fill option.
00:16 The Pick a Fill panel opens. The colors on it are set by the Theme.
Select the fourth option in the blue column.
00:20 Select the 80% option for transparency.
00:24 Select the Container Inspector icon to close its panels.
00:28 You'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.
Comments ( 0 )
Sign in to join the discussion.