> For the complete documentation index, see [llms.txt](https://docs.famewall.io/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.famewall.io/testimonial-widget-settings/card-colours-font-and-text-size.md).

# How to change the card colour, font and text size of your widget

Change the card background, text, star and link colours, the font and the text size of your testimonial widget, and reset a card colour that changed unexpectedly.

You can match your testimonial cards to your website: background colour, text colour, star colour, font and text size.

{% hint style="info" %}
Fonts and colours need a paid plan. On the Free plan they're greyed out with an **Upgrade Plan to fully customize style** note. Text size works on every plan.
{% endhint %}

## Change colours and font

1. Open your wall and click **Testimonial Widget**.
2. Open the **Testimonial Card Customization** panel and scroll to **Style**.
3. Pick a **Font Style**.
4. Under **Colors**, click a colour to change it:
   * **Card Color**: the background of each card.
   * **Font Color**: names, job titles, testimonial text and dates.
   * **Rating Color**: the stars on each card.
   * **Link Color**: links inside the testimonial text.
5. Click **Save Widget Changes**.

<figure><img src="https://2234661409-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwC4Q7ClSbJAc9WcmAoGA%2Fuploads%2Fgit-blob-2485f0d2e2ab3c949e8b6e5e9442c26e33c23d8b%2Fw-style-colors.png?alt=media" alt="The Style section of the widget&#x27;s Testimonial Card Customization panel with Font Style and the Card, Font, Rating and Link colours"><figcaption><p>Font and colour settings for the widget's cards</p></figcaption></figure>

{% hint style="warning" %}
Changing **Font Style** doesn't make the save button glow, so it's easy to forget. Click **Save Widget Changes** after picking a font.
{% endhint %}

## Accent colours for some card designs

A few card designs have one extra colour, shown under **Colors** only when that design is selected:

| Card design                | Extra colour                              |
| -------------------------- | ----------------------------------------- |
| Quote style and Broadsheet | **Quotation Color** (the quote marks)     |
| Colorband                  | **Band Color** (the coloured header band) |
| Ink Block                  | **Ink Color** (border and shadow)         |
| Score Block                | **Score Block Color** (the rating block)  |

## Make the text smaller

Under **Appearance**, click **Text Size**. A small dot in the icon means small text, a big dot means normal text. Save your changes. On narrow pages, the dual slider always uses small text.

## Cards turned yellow or grey? Reset the card colour

Choosing the **Pinboard** design sets the card colour to yellow, and **Plain Colored** sets it to light grey. That colour stays when you switch to another design. There's no reset button, but you can clear it:

1. In **Dark Mode**, turn **Dark Mode** on and then off again. This resets **Card Color** to the default.
2. Click **Save Widget Changes**.

Or simply pick a new **Card Color**.

## Good to know

* **Link Color** only affects links typed into testimonials. It doesn't change names, the Read More link or buttons.
* **Rating Color** changes the stars on the cards. The stars in the review banner and the AI summary stay yellow.
* Some fonts, like Verdana, Georgia and Comic Sans, are only shown if the visitor's device has them. Otherwise a similar font is used. Roboto, Poppins, Noto Sans and Source Sans Pro load for everyone.
* The Wall of Fame page has its own font and colour settings in **Testimonial Cards Customization**.

## Related

* [How to switch your widget to dark mode and choose a dark card style](/testimonial-widget-settings/dark-mode.md)
* [How to change your widget's card design](/testimonial-widget-settings/change-card-design.md)
* [Testimonial Widget Customization](/testimonial-widget-customization.md)