Here is the description of the complexities that I am wrestling with:
There are images on the right, and writing on the left.
The writing on the left is sitting on a nice little pink background color.
I would like for that background color to be a gradient pink.
There are complexities to achieve my result. Here is the complexities.
A. The Image itself, is really a big rectangular image.
There is a nice 'slice of ‘Images’ that are indesigned together.
Then on the other side of the ‘slice’, is a white space, open white space.
B. I uploaded this ‘white space on left, image on right’ Design into Pixlr.
C. I used paint bucket tool to add a pink background.
D. I used webflow to add a text block, gave it white color, and positioned it appropriately.
Sadly, pixlr has no gradient tool. So this is not the desire I want.
Webflow, does have a gradient tool.
A. The image itself, like i i said before, is a big rectangular shape with white slice on the left and image slice on the right.
So if i let it stand by itself, its chilling, taking up the whole page.
If i make a gradient block in the background, then it gets OverLaid by the big rectangular image… --> so no gradient makes it through when i slide that image over the Gradient.
B. Solution 2: Just make the text background color, a gradient. Make the text block you created in Webflow, a gradient.
Problem: The text block has rectangular edges. The gradient itself, would rectangular up against that clean diagonal line, overlaying on top of the image,
not giving that
“Fresh Slice” divider effect that I desire.
With these Understandings, how might I be able, to make a nice background pink gradient, to this awesome text?
This background needs to flush nice and perffectly evenly with the diagonal divider, as seamlessly as i did it with the pink background color.