To change the color of the “Submit” button in the Contact Form, add one of the following codes for your choice of color to the Custom CSS area in Site Options > Styling Options:
ALPHA GREEN:
#ka-submit, .ka-form-submit, .contact-form .ka-form-submit { border-top: 1px solid #7BB5A9; background-color: #035A48; background-image: linear-gradient(to bottom, #38917F, #035A48); /* required first in the list for IE11 */ background-image: -webkit-gradient(linear, left top, left bottom, from(#38917F), to(#035A48)); background-image: -webkit-linear-gradient(top, #38917F, #035A48); background-image: -moz-linear-gradient(top, #38917F, #035A48); background-image: -webkit-linear-gradient(top, #38917F, #035A48); background-image: -o-linear-gradient(top, #38917F, #035A48); background-image: ms-linear-gradient(to bottom, #38917F, #035A48); -pie-background: linear-gradient(to bottom, #38917F, #035A48); }
AUTUMN:
#ka-submit, .ka-form-submit, .contact-form .ka-form-submit { border-top: 1px solid #AA5D2F; background-color: #19292E; background-image: linear-gradient(to bottom, #92400E, #651605); /* required first in the list for IE11 */ background-image: -webkit-gradient(linear, left top, left bottom, from(#92400E), to(#651605)); background-image: -webkit-linear-gradient(top, #92400E, #651605); background-image: -moz-linear-gradient(top, #92400E, #651605); background-image: -webkit-linear-gradient(top, #92400E, #651605); background-image: -o-linear-gradient(top, #92400E, #651605); background-image: ms-linear-gradient(to bottom, #92400E, #651605); -pie-background: linear-gradient(to bottom, #92400E, #651605); }
BLUE GREY:
#ka-submit, .ka-form-submit, .contact-form .ka-form-submit { border-top: 1px solid #707180; background-color: #2E2D3D; background-image: linear-gradient(to bottom, #606173, #2E2D3D); /* required first in the list for IE11 */ background-image: -webkit-gradient(linear, left top, left bottom, from(#606173), to(#2E2D3D)); background-image: -webkit-linear-gradient(top, #606173, #2E2D3D); background-image: -moz-linear-gradient(top, #606173, #2E2D3D); background-image: -webkit-linear-gradient(top, #606173, #2E2D3D); background-image: -o-linear-gradient(top, #606173, #2E2D3D); background-image: ms-linear-gradient(to bottom, #606173, #2E2D3D); -pie-background: linear-gradient(to bottom, #606173, #2E2D3D); }
BUOY RED:
#ka-submit, .ka-form-submit, .contact-form .ka-form-submit { border-top: 1px solid #D56566; background-color: #951112; background-image: linear-gradient(to bottom, #CE4A4B, #951112); /* required first in the list for IE11 */ background-image: -webkit-gradient(linear, left top, left bottom, from(#CE4A4B), to(#951112)); background-image: -webkit-linear-gradient(top, #CE4A4B, #951112); background-image: -moz-linear-gradient(top, #CE4A4B, #951112); background-image: -webkit-linear-gradient(top, #CE4A4B, #951112); background-image: -o-linear-gradient(top, #CE4A4B, #951112); background-image: ms-linear-gradient(to bottom, #CE4A4B, #951112); -pie-background: linear-gradient(to bottom, #CE4A4B, #951112); }
CHERRY:
#ka-submit, .ka-form-submit, .contact-form .ka-form-submit { border-top: 1px solid #E41E04; background-color: #670600; background-image: linear-gradient(to bottom, #BA1A00, #670600); /* required first in the list for IE11 */ background-image: -webkit-gradient(linear, left top, left bottom, from(#BA1A00), to(#670600)); background-image: -webkit-linear-gradient(top, #BA1A00, #670600); background-image: -moz-linear-gradient(top, #BA1A00, #670600); background-image: -webkit-linear-gradient(top, #BA1A00, #670600); background-image: -o-linear-gradient(top, #BA1A00, #670600); background-image: ms-linear-gradient(to bottom, #BA1A00, #670600); -pie-background: linear-gradient(to bottom, #BA1A00, #670600); }
COFFEE:
#ka-submit, .ka-form-submit, .contact-form .ka-form-submit { border-top: 1px solid #76685D; background-color: #28211B; background-image: linear-gradient(to bottom, #584A3F, #28211B); /* required first in the list for IE11 */ background-image: -webkit-gradient(linear, left top, left bottom, from(#584A3F), to(#28211B)); background-image: -webkit-linear-gradient(top, #584A3F, #28211B); background-image: -moz-linear-gradient(top, #584A3F, #28211B); background-image: -webkit-linear-gradient(top, #584A3F, #28211B); background-image: -o-linear-gradient(top, #584A3F, #28211B); background-image: ms-linear-gradient(to bottom, #584A3F, #28211B); -pie-background: linear-gradient(to bottom, #584A3F, #28211B); }
COOL-BLUE:
#ka-submit, .ka-form-submit, .contact-form .ka-form-submit { border-top: 1px solid #00A2ED; background-color: #003869; background-image: linear-gradient(to bottom, #007CB7, #003869); /* required first in the list for IE11 */ background-image: -webkit-gradient(linear, left top, left bottom, from(#007CB7), to(#003869)); background-image: -webkit-linear-gradient(top, #007CB7, #003869); background-image: -moz-linear-gradient(top, #007CB7, #003869); background-image: -webkit-linear-gradient(top, #007CB7, #003869); background-image: -o-linear-gradient(top, #007CB7, #003869); background-image: ms-linear-gradient(to bottom, #007CB7, #003869); -pie-background: linear-gradient(to bottom, #007CB7, #003869); }
DARK:
#ka-submit, .ka-form-submit, .contact-form .ka-form-submit { border-top: 1px solid #4F4F5B; background-color: #0F0F0F; background-image: linear-gradient(to bottom, #3B3B47, #0F0F0F); /* required first in the list for IE11 */ background-image: -webkit-gradient(linear, left top, left bottom, from(#3B3B47), to(#0F0F0F)); background-image: -webkit-linear-gradient(top, #3B3B47, #0F0F0F); background-image: -moz-linear-gradient(top, #3B3B47, #0F0F0F); background-image: -webkit-linear-gradient(top, #3B3B47, #0F0F0F); background-image: -o-linear-gradient(top, #3B3B47, #0F0F0F); background-image: ms-linear-gradient(to bottom, #3B3B47, #0F0F0F); -pie-background: linear-gradient(to bottom, #3B3B47, #0F0F0F); }
FIRE:
#ka-submit, .ka-form-submit, .contact-form .ka-form-submit { border-top: 1px solid #F8914C; background-color: #DB3C02; background-image: linear-gradient(to bottom, #F37F32, #DB3C02); /* required first in the list for IE11 */ background-image: -webkit-gradient(linear, left top, left bottom, from(#F37F32), to(#DB3C02)); background-image: -webkit-linear-gradient(top, #F37F32, #DB3C02); background-image: -moz-linear-gradient(top, #F37F32, #DB3C02); background-image: -webkit-linear-gradient(top, #F37F32, #DB3C02); background-image: -o-linear-gradient(top, #F37F32, #DB3C02); background-image: ms-linear-gradient(to bottom, #F37F32, #DB3C02); -pie-background: linear-gradient(to bottom, #F37F32, #DB3C02); }
FOREST-GREEN:
#ka-submit, .ka-form-submit, .contact-form .ka-form-submit { border-top: 1px solid #8AA449; background-color: #354516; background-image: linear-gradient(to bottom, #71893B, #354516); /* required first in the list for IE11 */ background-image: -webkit-gradient(linear, left top, left bottom, from(#71893B), to(#354516)); background-image: -webkit-linear-gradient(top, #71893B, #354516); background-image: -moz-linear-gradient(top, #71893B, #354516); background-image: -webkit-linear-gradient(top, #71893B, #354516); background-image: -o-linear-gradient(top, #71893B, #354516); background-image: ms-linear-gradient(to bottom, #71893B, #354516); -pie-background: linear-gradient(to bottom, #71893B, #354516); }
FRENCH GREEN:
#ka-submit, .ka-form-submit, .contact-form .ka-form-submit { border-top: 1px solid #B4D2CD; background-color: #58837C; background-image: linear-gradient(to bottom, #93BEB7, #58837C); /* required first in the list for IE11 */ background-image: -webkit-gradient(linear, left top, left bottom, from(#93BEB7), to(#58837C)); background-image: -webkit-linear-gradient(top, #93BEB7, #58837C); background-image: -moz-linear-gradient(top, #93BEB7, #58837C); background-image: -webkit-linear-gradient(top, #93BEB7, #58837C); background-image: -o-linear-gradient(top, #93BEB7, #58837C); background-image: ms-linear-gradient(to bottom, #93BEB7, #58837C); -pie-background: linear-gradient(to bottom, #93BEB7, #58837C); }
GOLDEN:
#ka-submit, .ka-form-submit, .contact-form .ka-form-submit { border-top: 1px solid #D8BD64; background-color: #81570D; background-image: linear-gradient(to bottom, #BFA12F, #81570D); /* required first in the list for IE11 */ background-image: -webkit-gradient(linear, left top, left bottom, from(#BFA12F), to(#81570D)); background-image: -webkit-linear-gradient(top, #BFA12F, #81570D); background-image: -moz-linear-gradient(top, #BFA12F, #81570D); background-image: -webkit-linear-gradient(top, #BFA12F, #81570D); background-image: -o-linear-gradient(top, #BFA12F, #81570D); background-image: ms-linear-gradient(to bottom, #BFA12F, #81570D); -pie-background: linear-gradient(to bottom, #BFA12F, #81570D); }
GREY:
#ka-submit, .ka-form-submit, .contact-form .ka-form-submit { border-top: 1px solid #717880; background-color: #2A3139; background-image: linear-gradient(to bottom, #565D65, #2A3139); /* required first in the list for IE11 */ background-image: -webkit-gradient(linear, left top, left bottom, from(#565D65), to(#2A3139)); background-image: -webkit-linear-gradient(top, #565D65, #2A3139); background-image: -moz-linear-gradient(top, #565D65, #2A3139); background-image: -webkit-linear-gradient(top, #565D65, #2A3139); background-image: -o-linear-gradient(top, #565D65, #2A3139); background-image: ms-linear-gradient(to bottom, #565D65, #2A3139); -pie-background: linear-gradient(to bottom, #565D65, #2A3139); }
LIME-GREEN:
#ka-submit, .ka-form-submit, .contact-form .ka-form-submit { border-top: 1px solid #D3DA68; background-color: #638401; background-image: linear-gradient(to bottom, #B2C303, #638401); /* required first in the list for IE11 */ background-image: -webkit-gradient(linear, left top, left bottom, from(#B2C303), to(#638401)); background-image: -webkit-linear-gradient(top, #B2C303, #638401); background-image: -moz-linear-gradient(top, #B2C303, #638401); background-image: -webkit-linear-gradient(top, #B2C303, #638401); background-image: -o-linear-gradient(top, #B2C303, #638401); background-image: ms-linear-gradient(to bottom, #B2C303, #638401); -pie-background: linear-gradient(to bottom, #B2C303, #638401); }
ORANGE:
#ka-submit, .ka-form-submit, .contact-form .ka-form-submit { border-top: 1px solid #FEBF62; background-color: #CA6A00; background-image: linear-gradient(to bottom, #FDA41E, #CA6A00); /* required first in the list for IE11 */ background-image: -webkit-gradient(linear, left top, left bottom, from(#FDA41E), to(#CA6A00)); background-image: -webkit-linear-gradient(top, #FDA41E, #CA6A00); background-image: -moz-linear-gradient(top, #FDA41E, #CA6A00); background-image: -webkit-linear-gradient(top, #FDA41E, #CA6A00); background-image: -o-linear-gradient(top, #FDA41E, #CA6A00); background-image: ms-linear-gradient(to bottom, #FDA41E, #CA6A00); -pie-background: linear-gradient(to bottom, #FDA41E, #CA6A00); }
PERIWINKLE:
#ka-submit, .ka-form-submit, .contact-form .ka-form-submit { border-top: 1px solid #7589C8; background-color: #4C1267; background-image: linear-gradient(to bottom, #596CB1, #4C1267); /* required first in the list for IE11 */ background-image: -webkit-gradient(linear, left top, left bottom, from(#596CB1), to(#4C1267)); background-image: -webkit-linear-gradient(top, #596CB1, #4C1267); background-image: -moz-linear-gradient(top, #596CB1, #4C1267); background-image: -webkit-linear-gradient(top, #596CB1, #4C1267); background-image: -o-linear-gradient(top, #596CB1, #4C1267); background-image: ms-linear-gradient(to bottom, #596CB1, #4C1267); -pie-background: linear-gradient(to bottom, #596CB1, #4C1267); }
PINK:
#ka-submit, .ka-form-submit, .contact-form .ka-form-submit { border-top: 1px solid #BD689C; background-color: #6D1F49; background-image: linear-gradient(to bottom, #B14D8B, #6D1F49); /* required first in the list for IE11 */ background-image: -webkit-gradient(linear, left top, left bottom, from(#B14D8B), to(#6D1F49)); background-image: -webkit-linear-gradient(top, #B14D8B, #6D1F49); background-image: -moz-linear-gradient(top, #B14D8B, #6D1F49); background-image: -webkit-linear-gradient(top, #B14D8B, #6D1F49); background-image: -o-linear-gradient(top, #B14D8B, #6D1F49); background-image: ms-linear-gradient(to bottom, #B14D8B, #6D1F49); -pie-background: linear-gradient(to bottom, #B14D8B, #6D1F49); }
POLITICAL-BLUE:
#ka-submit, .ka-form-submit, .contact-form .ka-form-submit { border-top: 1px solid #4B8CA8; background-color: #013558; background-image: linear-gradient(to bottom, #1E6F92, #013558); /* required first in the list for IE11 */ background-image: -webkit-gradient(linear, left top, left bottom, from(#1E6F92), to(#013558)); background-image: -webkit-linear-gradient(top, #1E6F92, #013558); background-image: -moz-linear-gradient(top, #1E6F92, #013558); background-image: -webkit-linear-gradient(top, #1E6F92, #013558); background-image: -o-linear-gradient(top, #1E6F92, #013558); background-image: ms-linear-gradient(to bottom, #1E6F92, #013558); -pie-background: linear-gradient(to bottom, #1E6F92, #013558); }
PURPLE:
#ka-submit, .ka-form-submit, .contact-form .ka-form-submit { border-top: 1px solid #B75683; background-color: #371022; background-image: linear-gradient(to bottom, #863C5F, #371022); /* required first in the list for IE11 */ background-image: -webkit-gradient(linear, left top, left bottom, from(#863C5F), to(#371022)); background-image: -webkit-linear-gradient(top, #863C5F, #371022); background-image: -moz-linear-gradient(top, #863C5F, #371022); background-image: -webkit-linear-gradient(top, #863C5F, #371022); background-image: -o-linear-gradient(top, #863C5F, #371022); background-image: ms-linear-gradient(to bottom, #863C5F, #371022); -pie-background: linear-gradient(to bottom, #863C5F, #371022); }
ROYAL-BLUE:
#ka-submit, .ka-form-submit, .contact-form .ka-form-submit { border-top: 1px solid #496D9D; background-color: #182947; background-image: linear-gradient(to bottom, #375885, #182947); /* required first in the list for IE11 */ background-image: -webkit-gradient(linear, left top, left bottom, from(#375885), to(#182947)); background-image: -webkit-linear-gradient(top, #375885, #182947); background-image: -moz-linear-gradient(top, #375885, #182947); background-image: -webkit-linear-gradient(top, #375885, #182947); background-image: -o-linear-gradient(top, #375885, #182947); background-image: ms-linear-gradient(to bottom, #375885, #182947); -pie-background: linear-gradient(to bottom, #375885, #182947); }
SAFFRON-BLUE:
#ka-submit, .ka-form-submit, .contact-form .ka-form-submit { border-top: 1px solid #8595A1; background-color: #2E4250; background-image: linear-gradient(to bottom, #677B89, #2E4250); /* required first in the list for IE11 */ background-image: -webkit-gradient(linear, left top, left bottom, from(#677B89), to(#2E4250)); background-image: -webkit-linear-gradient(top, #677B89, #2E4250); background-image: -moz-linear-gradient(top, #677B89, #2E4250); background-image: -webkit-linear-gradient(top, #677B89, #2E4250); background-image: -o-linear-gradient(top, #677B89, #2E4250); background-image: ms-linear-gradient(to bottom, #677B89, #2E4250); -pie-background: linear-gradient(to bottom, #677B89, #2E4250); }
SILVER:
#ka-submit, .ka-form-submit, .contact-form .ka-form-submit { border-top: 1px solid #EFEFEF; background-color: #757575; background-image: linear-gradient(to bottom, #BFBFBF, #757575); /* required first in the list for IE11 */ background-image: -webkit-gradient(linear, left top, left bottom, from(#BFBFBF), to(#757575)); background-image: -webkit-linear-gradient(top, #BFBFBF, #757575); background-image: -moz-linear-gradient(top, #BFBFBF, #757575); background-image: -webkit-linear-gradient(top, #BFBFBF, #757575); background-image: -o-linear-gradient(top, #BFBFBF, #757575); background-image: ms-linear-gradient(to bottom, #BFBFBF, #757575); -pie-background: linear-gradient(to bottom, #BFBFBF, #757575); }
SKY-BLUE:
#ka-submit, .ka-form-submit, .contact-form .ka-form-submit { border-top: 1px solid #32C4DD; background-color: #0077AF; background-image: linear-gradient(to bottom, #01B2D3, #0077AF); /* required first in the list for IE11 */ background-image: -webkit-gradient(linear, left top, left bottom, from(#01B2D3), to(#0077AF)); background-image: -webkit-linear-gradient(top, #01B2D3, #0077AF); background-image: -moz-linear-gradient(top, #01B2D3, #0077AF); background-image: -webkit-linear-gradient(top, #01B2D3, #0077AF); background-image: -o-linear-gradient(top, #01B2D3, #0077AF); background-image: ms-linear-gradient(to bottom, #01B2D3, #0077AF); -pie-background: linear-gradient(to bottom, #01B2D3, #0077AF); }
STEEL-GREEN:
#ka-submit, .ka-form-submit, .contact-form .ka-form-submit { border-top: 1px solid #88A4A9; background-color: #30535A; background-image: linear-gradient(to bottom, #6A8D94, #30535A); /* required first in the list for IE11 */ background-image: -webkit-gradient(linear, left top, left bottom, from(#6A8D94), to(#30535A)); background-image: -webkit-linear-gradient(top, #6A8D94, #30535A); background-image: -moz-linear-gradient(top, #6A8D94, #30535A); background-image: -webkit-linear-gradient(top, #6A8D94, #30535A); background-image: -o-linear-gradient(top, #6A8D94, #30535A); background-image: ms-linear-gradient(to bottom, #6A8D94, #30535A); -pie-background: linear-gradient(to bottom, #6A8D94, #30535A); }
TEAL-GREY:
#ka-submit, .ka-form-submit, .contact-form .ka-form-submit { border-top: 1px solid #4E646D; background-color: #19292E; background-image: linear-gradient(to bottom, #3A525C, #19292E); /* required first in the list for IE11 */ background-image: -webkit-gradient(linear, left top, left bottom, from(#3A525C), to(#19292E)); background-image: -webkit-linear-gradient(top, #3A525C, #19292E); background-image: -moz-linear-gradient(top, #3A525C, #19292E); background-image: -webkit-linear-gradient(top, #3A525C, #19292E); background-image: -o-linear-gradient(top, #3A525C, #19292E); background-image: ms-linear-gradient(to bottom, #3A525C, #19292E); -pie-background: linear-gradient(to bottom, #3A525C, #19292E); }
TEAL:
#ka-submit, .ka-form-submit, .contact-form .ka-form-submit { border-top: 1px solid #58BFAE; background-color: #0D4E54; background-image: linear-gradient(to bottom, #45988E, #0D4E54); /* required first in the list for IE11 */ background-image: -webkit-gradient(linear, left top, left bottom, from(#45988E), to(#0D4E54)); background-image: -webkit-linear-gradient(top, #45988E, #0D4E54); background-image: -moz-linear-gradient(top, #45988E, #0D4E54); background-image: -webkit-linear-gradient(top, #45988E, #0D4E54); background-image: -o-linear-gradient(top, #45988E, #0D4E54); background-image: ms-linear-gradient(to bottom, #45988E, #0D4E54); -pie-background: linear-gradient(to bottom, #45988E, #0D4E54); }
TUF-GREEN:
#ka-submit, .ka-form-submit, .contact-form .ka-form-submit { border-top: 1px solid #969997; background-color: #3D403E; background-image: linear-gradient(to bottom, #7C807D, #3D403E); /* required first in the list for IE11 */ background-image: -webkit-gradient(linear, left top, left bottom, from(#7C807D), to(#3D403E)); background-image: -webkit-linear-gradient(top, #7C807D, #3D403E); background-image: -moz-linear-gradient(top, #7C807D, #3D403E); background-image: -webkit-linear-gradient(top, #7C807D, #3D403E); background-image: -o-linear-gradient(top, #7C807D, #3D403E); background-image: ms-linear-gradient(to bottom, #7C807D, #3D403E); -pie-background: linear-gradient(to bottom, #7C807D, #3D403E); }
VIOLET:
#ka-submit, .ka-form-submit, .contact-form .ka-form-submit { border-top: 1px solid #9C54E4; background-color: #3E1966; background-image: linear-gradient(to bottom, #7D2FD3, #3E1966); /* required first in the list for IE11 */ background-image: -webkit-gradient(linear, left top, left bottom, from(#7D2FD3), to(#3E1966)); background-image: -webkit-linear-gradient(top, #7D2FD3, #3E1966); background-image: -moz-linear-gradient(top, #7D2FD3, #3E1966); background-image: -webkit-linear-gradient(top, #7D2FD3, #3E1966); background-image: -o-linear-gradient(top, #7D2FD3, #3E1966); background-image: ms-linear-gradient(to bottom, #7D2FD3, #3E1966); -pie-background: linear-gradient(to bottom, #7D2FD3, #3E1966); }
VISTA-BLUE:
#ka-submit, .ka-form-submit, .contact-form .ka-form-submit { border-top: 1px solid #7CD2DB; background-color: #168995; background-image: linear-gradient(to bottom, #50C3CF, #168995); /* required first in the list for IE11 */ background-image: -webkit-gradient(linear, left top, left bottom, from(#50C3CF), to(#168995)); background-image: -webkit-linear-gradient(top, #50C3CF, #168995); background-image: -moz-linear-gradient(top, #50C3CF, #168995); background-image: -webkit-linear-gradient(top, #50C3CF, #168995); background-image: -o-linear-gradient(top, #50C3CF, #168995); background-image: ms-linear-gradient(to bottom, #50C3CF, #168995); -pie-background: linear-gradient(to bottom, #50C3CF, #168995); }
YOGI-GREEN:
#ka-submit, .ka-form-submit, .contact-form .ka-form-submit { border-top: 1px solid #D0D9C3; background-color: #818E6D; background-image: linear-gradient(to bottom, #BBC8A7, #818E6D); /* required first in the list for IE11 */ background-image: -webkit-gradient(linear, left top, left bottom, from(#BBC8A7), to(#818E6D)); background-image: -webkit-linear-gradient(top, #BBC8A7, #818E6D); background-image: -moz-linear-gradient(top, #BBC8A7, #818E6D); background-image: -webkit-linear-gradient(top, #BBC8A7, #818E6D); background-image: -o-linear-gradient(top, #BBC8A7, #818E6D); background-image: ms-linear-gradient(to bottom, #BBC8A7, #818E6D); -pie-background: linear-gradient(to bottom, #BBC8A7, #818E6D); }
You may also change the color of the button’s font. To do so, add the following code:
#ka-submit, .ka-form-submit, .contact-form .ka-form-submit {color:#FFF !important;}
Change the color code as needed.