Streaming live at 10am (PST)

Gradient - Starting with the same color on both ends

When I want to create a subtle gradient, I start with a specific color at one side of the bar. Then, at the other side of the bar I want to start with the exact same color, and from there to change it slightly in the color space.
The problem is, that as soon as the webflow interface recognises I chose 2 identically colors, it changes the style to a solid color :tired_face:
Live: https://youtu.be/lpe7Wc_BFjs

Am I the only one who’s dealing with this? :sweat_smile:

Hi @Avivtech, you’re not alone. I have this exact same problem, which has been frustrating on the previous two websites I’ve created given the gradients in use.

To be honest, sir really subtle gradients I ended up hand-coding a gradient class called .blendo, and a class in the Designer called .blendo, and the gradients are added on export/publish. This was less frustrating than the solid color switch you are also experiencing. :confused:

Anyone else having the issue?

Steve

:rofl: oh my! you ended up hand coding gradient!?

I use a workaround- I start with one color and reduce it’s opacity to 99%, then I edit the 2nd color, then I go back and reset the 1st color’s opacity back to 100%…

1 Like

I tend to use subtle gradients a lot, the inner rage this sets off in me is unreal. I’ve never thought to set one to 99 and work from there, nice idea!

oh my! ended up hand coding gradient!

I googled the code, it’s not tooooo bad :wink:

.blendo { background: -webkit-linear-gradient(60deg, #00aaff, #bfff00); background: -moz-linear-gradient(60deg, #00aaff, #bfff00); background: -o-linear-gradient(60deg, #00aaff, #bfff00); background: -ms-linear-gradient(60deg, #00aaff, #bfff00); background: linear-gradient(60deg, #00aaff, #bfff00); -webkit-background-clip: text; -webkit-text-fill-color: transparent; }

I use a workaround- I start with one color and reduce it’s opacity to 99%, then I edit the 2nd color, then I go back and reset the 1st color’s opacity back to 100%…

That’s a nice workaround, thanks for the hint :wink:

Steve