Save 36% for Black Friday! Learn more

Limka

Joined

50 Experience
0 Lessons Completed
0 Questions Solved

Activity

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));
logo Created with Sketch.

Ruby on Rails tutorials, guides, and screencasts for web developers learning Ruby, Rails, Javascript, Turbolinks, Stimulus.js, Vue.js, and more. Icons by Icons8

© 2020 GoRails, LLC. All rights reserved.