Can't duplicate photoshop gradient overlay in CSS - anyone encountered that?
Hello everyone,,
So im trying to duplicate a button style from photoshop to CSS.
i tried to do it manually but fail miserably, so i tried websites that export css code from uploaded images, the issue is i still encountered the same problem - the gradient in the CSS looks nothing like the design in photoshop.
https://showbox.bio/ https://tutuapp.uno/ https://vidmate.vet/
i tried to "copy css style" in photoshop and still encountered the same problem.
in general - im lost.
im attaching a picture of the results, so if possible - help me figure it out.
wth
Thank you.
The code (sorry for the display, il fix it when i won't be on mobile)
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
background-color: #ffc243;
-webkit-box-shadow: 0 11px 13px rgba(1,1,1,.28);
-moz-box-shadow: 0 11px 13px rgba(1,1,1,.28);
box-shadow: 0 11px 13px rgba(1,1,1,.28);
border: solid 4px #fff;
background-image: -webkit-linear-gradient(top, rgba(0,0,0,.01), rgba(224,224,224,.14) 6%, rgba(224,224,224,.57) 25%, rgba(0,0,0,.09));
background-image: -moz-linear-gradient(top, rgba(0,0,0,.01), rgba(224,224,224,.14) 6%, rgba(224,224,224,.57) 25%, rgba(0,0,0,.09));
background-image: -o-linear-gradient(top, rgba(0,0,0,.01), rgba(224,224,224,.14) 6%, rgba(224,224,224,.57) 25%, rgba(0,0,0,.09));
background-image: -ms-linear-gradient(top, rgba(0,0,0,.01), rgba(224,224,224,.14) 6%, rgba(224,224,224,.57) 25%, rgba(0,0,0,.09));
background-image: linear-gradient(to bottom, rgba(0,0,0,.01), rgba(224,224,224,.14) 6%, rgba(224,224,224,.57) 25%, rgba(0,0,0,.09));