# Change Style

The look of all billing pages is highly customizable so that they integrate seamlessly with your website/app. Using CSS, colors and fonts can be changed, and content can be added or removed. Below are the steps to change the style.

{% hint style="info" %}
Easy style changes coming to the dashboard soon!
{% endhint %}

## Step 1: Set Default Colors

Navigate to your billing page on the Billflow dashboard. There you will see a section for Design changes. Use this section to set your default colors. You can also add custom CSS here. To learn more about adding custom CSS, continue reading below.

![Dashboard Design Options](/files/-MMRiuyVbkEkE7hMopu-)

## Step 2: Apply Custom Styling

You can add custom CSS to the 'CSS Modifications' section of the Design tab. 

### Step 1: Determine class

The easiest way to determine the CSS class of the piece you wish to change is to inspect element with your browser. Right click on the thing you want to change and select Inspect. We can see the class name of this button is *.servicebot-btn-primary*

![Inspecting Billing Page Style](/files/-MJ36G5Miesh-ZiGt1-9)

### Step 2: Override style

Now we can override the style. You can do this within your browser then copy the style to your CSS file.

![](/files/-MJ36hmEnleMLDbBeVaa)

## Templates

Below are examples & templates for billing page style changes. Just add the CSS to your project to add to your billing page.

{% content-ref url="/pages/-MGp-uhmJJtALiI7giMf" %}
[Plan Picker Style Templates](/how-to/change-style/plan-picker-style-templates.md)
{% endcontent-ref %}

{% content-ref url="/pages/-MGp-woNQpzKtTivzid\_" %}
[Customer Portal Style Templates](/how-to/change-style/customer-portal-style-templates.md)
{% endcontent-ref %}

{% content-ref url="/pages/-MGp0-9miuJk6ZYPbdIy" %}
[Pricing Page Style Templates](/how-to/change-style/pricing-page-style-templates.md)
{% endcontent-ref %}

{% content-ref url="/pages/-MGp022oJ-7-OcCyEsXR" %}
[Checkout Form Style Templates](/how-to/change-style/checkout-form-style-templates.md)
{% endcontent-ref %}

 


---

# Agent Instructions: 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:

```
GET https://docs.billflow.io/how-to/change-style.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
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.