Topics

Kevin Powell - Community•12mo ago

Linear Gradients

Hi all, I'm trying to add two linear-gradients on a div - one starting from the right and one starting from the left-most corner. When I'm separating both the gradients only one of them persists. Can someone tell me what am I doing wrong?

background: linear-gradient(-90deg, #FF6D00, #FF6D00 20px, #FD4602 20px), linear-gradient(139deg, #FF6D00, #FF6D00 98px,#FD4602 98px);

background: linear-gradient(-90deg, #FF6D00, #FF6D00 20px, #FD4602 20px), linear-gradient(139deg, #FF6D00, #FF6D00 98px,#FD4602 98px);

I want the white part to be the 2nd gradient that I've mentioned. Thanks

5 Replies

Wolle•12mo ago

Iirc multiple backgrounds get layered, so the second would overwrite the first. Try adding a transparent part to the second, where you wnat the first to be visible.

Satya•12mo ago

Can you give me an example pls?

Rägnar O'ock•12mo ago

Simply use color stops with alpha information something like rgba(255, 0, 255, 128) or #FF00FF88

glutonium•12mo ago

i thought alpha values are from 0 to 1 didn't know you can put values like 128

Rägnar O'ock•12mo ago

I'm a bit rusty on rgba, it might be that...

Kevin Powell - Community Join

A friendly place for developers to meet other devs, ask questions, get help, and just have a good time 🙂.

34KMembers

View on Discord

Want results from more Discord servers?

Add your server

More Posts

How can I give my table header a border-radius on chrome browser?that the table headers are slightly different between chrome and Firefox. 1. Firefox browser applied Struggling to get InteractionObserver to fire only onceIve got a set of cards in the project section of my portoflio running with InteractionObserver. The Good CSS Framework to Speed up look and feelWhat's a good css framework that might speed up design a bit that wont be too complicated to learn? CSS connect to the filesWho can help me out 😄 I can't get my CSS connected? I already tried ./, ../ .../ or even just / no React: passing in arrays as arguments to componentsGH: https://github.com/nnall/Inventory.git I have a <Filter> component which is part of a pop-out m Help settle a debate I have with a designerHi all, my designer at work and I have a disagreement. Can someone more experienced settle this argu prevent scrolling on body but allow only on a divHello devs, in my gmail clone project, I’ve been facing an issue on making only my email-list div sc Glowing font problem on SafariHi guys, I created a landing page for a client. Designer prepared a views in figma with glowing head trying to and scrolltrigger to gsap timelineHey everyone can anyone whose familiar with using gsap in react help me out here,I am trying to crea using :after on button not work properlyHi there, I'm using an arrow next to my active button but it seems not working properly with the ac