How Do I Make My "Add To Cart" Button Look Like This?

[Simon159]

This is my store : https://charmente.com/products/magnetic-seashell-case

This is what the "Add To Cart" button looks like now : 

 

This is the "Add To Cart" button I want : https://snugshark.co/products/sharkblanket

 

[TerenceKEANE]

Hi,

The following code will do what you want. You can change the values as you like. If you encounter any issues again, feel free to write, I'll help.

Navigate to the 'Edit Code' option in your theme settings, then search for “base.css” in the search bar and add below codes.

.product-form__submit {
    background: #8dd1d1 !important;
    color: #FDFBF7 !important;
    text-transform: uppercase!important;
    font-weight: 700!important;
}


.product-form__submit::before, .product-form__submit::after{
	    outline: none !important;
    box-shadow: unset !important;
        border: none !important;

	    
}

[Raj-webdesigner]

Add This css in your edit Code > Base.css File

.product-form .product-form__buttons {
    max-width: 100%;
}

[topnewyork · Accepted solution]

Hello @Simon159 
Go to themes > code editor > find base.css
and then paste this code at the bottom of file 

button#ProductSubmitButton-template--22072609538353__main{

	    background: #8dd1d1 !important;
	    color: #ffff !important;
	    font-size: 19px;
            font-weight: 700;
}

.product-form__submit::before, .product-form__submit::after{
            outline: none !important;
            box-shadow: unset !important;
}