How to change font of flatpickr | XM Community
Skip to main content
Solved

How to change font of flatpickr

  • May 22, 2022
  • 2 replies
  • 1425 views
C
Level 1 ●
Forum|alt.badge.img+5

I have added a flatpickr for a date question however the font of the months etc. is Times new Roman which doesn't match the rest of my survey. How can I change the font to match my survey?

Best answer by bgooldfed

Hi cturtle,
You can add a CSS rule in Look & Feel -> Style -> Custom CSS:
.flatpickr-calendar {
font-family: Arial;     /*change to whatever font you want
}
Bonus: if you want more font options, you can use something like Google Fonts to add additional fonts into the header of your survey :)

    2 replies

    bgooldfed
    Level 4 ●●●●
    Forum|alt.badge.img+25
    • bgooldfed
    • Level 4 ●●●●
    • Answer
    • May 23, 2022

    Hi cturtle,
    You can add a CSS rule in Look & Feel -> Style -> Custom CSS:
    .flatpickr-calendar {
    font-family: Arial;     /*change to whatever font you want
    }
    Bonus: if you want more font options, you can use something like Google Fonts to add additional fonts into the header of your survey :)

    C
    K
    P
    Level 1 ●
    Forum|alt.badge.img+6
    • philipangwk
    • Level 1 ●
    • October 13, 2024

    Very helpful, bgooldfed! Thank you!

    Is it also possible to change the font size?

     

    Thanks,

    PA

    Terms & ConditionsAccessibility statement