How can I alter the contact form button style from solid to outline on Dawn?

[hasanali1]

how to change the button style of the contact form from solid to outline?

website - https://the-style-luxe.myshopify.com/

password - reucho

thanks in advance!!

[Yeady123]

To change the contact form button style from solid to outline in the Shopify Dawn theme, you can follow these steps:

1. Go to your Shopify Admin panel and click on “Online Store” and then “Themes”.
2. Find the theme that you are currently using and click on “Actions” and then “Edit Code”.
3. From the left sidebar, click on “Assets” and open the “theme.scss.liquid” file.
4. Scroll down to the bottom of the file and add the following code:

.contact-form__submit-btn {
  background-color: transparent;
  border: 2px solid #000000;
  color: #000000;
  padding: 10px 20px;
}

.contact-form__submit-btn:hover {
  background-color: #000000;
  color: #ffffff;
}
​

1. Save the changes and preview your website to see the updated contact form button style.

In the above code, we have changed the background-color of the button to transparent, added a 2px solid border with a black color, changed the text color to black, and added some padding. We have also added a hover effect that changes the background color to black and the text color to white when the user hovers over the button. You can adjust the values in the code to suit your preferences.

[Rnzzz]

Hi
I hope you’re doing fine. I just want to share this workarounds you can try to change the button’s color without coding.

You can follow these simple steps to change the button color:

1. Go to Store Admin>Online Store
2. Click the Customize button
3. Select ‘pages’ from the menu in the upper center.
4. Then pick ‘contact’
5. Look for the ‘paint brush’ icon in the left side panel
6. Click ‘Colors’
7. Change colors based on your preference.
8. In the same section, click ‘buttons’
9. Change the button’s settings to make the border appear.
10. Save
    Please refer to the images attached. Thanks