> For the complete documentation index, see [llms.txt](https://help.microweber.com/user-guide/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://help.microweber.com/user-guide/how-to-change-primary-button-colors.md).

# How to change primary button colors

Changing the primary button colors in Microweber typically involves modifying the theme's CSS (Cascading Style Sheets). Here's a step-by-step guide:

1. **Accessing the Microweber Admin Panel:**
   * Log in to your Microweber website's admin panel by adding "/admin" to your website URL and entering your login credentials.
2. **Navigating to the Theme Settings:**
   * Once logged in, navigate to the "Design" section in the admin panel. Look for options related to "Theme" or "Template Settings."
3. **Selecting the Active Theme:**
   * In the theme settings, you'll likely see a list of installed themes or templates. Choose the active theme you want to customize.<br>

     <figure><img src="https://1981302401-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fyz8FiPTUs5koUyant2Jj%2Fuploads%2F6lh2Q0UENFbqIfYRxkOB%2Fimage.png?alt=media&amp;token=7e05654e-055e-4117-8e65-571d08601999" alt=""><figcaption></figcaption></figure>
4. **Modifying the Button Colors:**

   * Once you've found the button styles, you'll see properties such as "background-color," "border-color," and "color." These properties control the button's background color, border color, and text color, respectively.<br>

     <figure><img src="https://1981302401-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fyz8FiPTUs5koUyant2Jj%2Fuploads%2FpWQhoPS6qGXQ2lYWUy5w%2Fimage.png?alt=media&amp;token=e3200dce-5de2-4ea8-bff4-995e580d4686" alt=""><figcaption></figcaption></figure>
   * Select the **Buttons** Section

   <figure><img src="https://1981302401-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fyz8FiPTUs5koUyant2Jj%2Fuploads%2F4nmOZqdkitmRm6tjEGRe%2Fimage.png?alt=media&amp;token=fab6a8fa-ff78-42c8-bdec-4f3e4c198805" alt=""><figcaption></figcaption></figure>

   * Modify the values of these properties to change the primary button colors to your desired colors. You can use hexadecimal color codes, RGB values, or color names.
5. **Previewing Changes:**
   * After making the changes, you can preview them to see how the primary buttons look with the new colors. Some theme settings may provide a preview option.
6. **Saving Changes:**
   * Once you're satisfied with the button colors, save your changes. Look for a "Save" or "Update" button within the CSS editor.
7. **Testing:**
   * After saving the changes, navigate to your website's front-end to see the updated button colors. Test the buttons to ensure they function as expected and that the colors are visually appealing.
8. **Adjusting as Needed:**
   * If necessary, you can further adjust the button styles by fine-tuning the CSS properties until you achieve the desired appearance.

Remember to make a backup of your theme's CSS before making any changes, so you can revert to the original if needed. Additionally, some themes might offer built-in customization options for button colors, so check if there are any theme-specific settings available in the admin panel.


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter, and the optional `goal` query parameter:

```
GET https://help.microweber.com/user-guide/how-to-change-primary-button-colors.md?ask=<question>&goal=<endgoal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal.

The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.