I want to add a line next to the text box

I want to add that gradient (orange to pink) line to the left of the text box but am not sure how to do it. I thought a grid might work but I can’t get the grid to get smaller than 1F. Would appreciate any ideas!

This is done with a Block Quote to get the line. You can also just click on Border and click on the Left edge to choose the color. In Block Quotes it starts with a 5 px border.

image
image

That much said, I have no clue on the gradient part unless you do it as an empty div block with a gradient background like this:
image

image
image
https://preview.webflow.com/preview/blank-test-site-8e89ea?utm_medium=preview_link&utm_source=designer&utm_content=blank-test-site-8e89ea&preview=353ffd3dd54416aad9f1ed2b6efdc01f&workflow=preview

1 Like

You can simply class your paragraph, and give it a left-padding and a solid left border ( maybe 3px? ).

To make it a gradient border you’ll need to add a “Custom property” at the bottom of the style panel. You want;

border-image
linear-gradient(to bottom, orange, red) 1

image

Here’s a quick experiment in which I used a 5px border;

image

1 Like