SUBMIT BUTTON GRADIENT STYLE

Developer Support CMS Development
1

Hello, How would i put gradient style on my submit button?

2

Hi @Vikshan,

open your theme.css and write it like this:

form input[type="submit"]{
background: rgb(34,193,195);
background: -moz-linear-gradient(71deg, rgba(34,193,195,1) 0%, rgba(253,187,45,1) 100%);
background: -webkit-linear-gradient(71deg, rgba(34,193,195,1) 0%, rgba(253,187,45,1) 100%);
background: linear-gradient(71deg, rgba(34,193,195,1) 0%, rgba(253,187,45,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#22c1c3",endColorstr="#fdbb2d",GradientType=1);
{# more options #}
}

form input[type="submit"]:hover{
{# place your hover styling here #}
}

form input[type="submit"]:focus{
{# place your focus styling here #}
}

I recommend to use a generator like cssgradient.io for the code.

Or - you can check out my github repo - I’ve uploaded a HubSpot gradient macro the other day.

best,

Anton

3

@Anton Thank you, I will try it and let you know if I encounter any problem