Customize countdown fonts and colors
Here you change the fonts of the countdown text and the colors of the text and numbers, without changing the template's overall design.
When to use this article
- You want clearer numbers.
- You want to match your store's colors.
- You want better readability on phones.
Before you start
- Open the countdown in the Edit countdown timer editor from My campaigns. Click the Edit icon, or Customize design for older countdowns.
- To change the image, see Change the countdown image.
Steps
- In the Font style section, change Font size with the slider. The value is between 10 and 48, and it starts at the template's size.
- Choose a Font weight: Regular or Bold.
- Choose a Font family: Tajawal (recommended), Cairo or Amiri.
- In the Colors section, change the Number color.
- Change the Text color.
- Check the preview.
- Click Save changes.
Font size, Font weight, Font family and Text color change the countdown's text: the heading, the description, the button and the email field. Number color changes the color of the countdown numbers and the unit words next to them, such as days and hours.
To control the size or font of the numbers, use Edit a countdown in the advanced editor.
You can choose a color from the picker or enter a color code. The code is # followed by 6 hex digits (0-9, A-F), such as #1A73E8.
This editor does not change the template's background or overall design. It changes only the text and the colors. Images are the exception: you change them in the Images section.
Check that it works
- The text or the number colors change in the preview.
- The new color appears after you click Save changes.
Common errors
| Error | Fix |
|---|---|
| The color is too close to the background | Choose a color with more contrast. |
| The color code was not accepted, and "The number color is invalid" or "The text color is invalid" appears | Enter it as # followed by 6 hex digits (0-9, A-F), or choose the color with the picker. |
Related articles
Did this article answer your question?