Widgets: Change the color of the Animated Header text

  • Profile Image
    Asked on July 13, 2016 at 06:42 AM


    I am using the "Animated Heading" widget in my form - however the default font colour is no use on my form

    There is a CSS edit function in the widget wizard - but I don't know what to put in it to change the colour - I have searched multiple forums and tried different code but to no avail!

    This is the widget - https://widgets.jotform.com/widget/animated_heading

    These are the properties on my form for the widget


    Can someone please help me with the correct CSS code to change the font to a bright orange please


    Many thanks in advance



  • Profile Image
    Answered on July 13, 2016 at 08:05 AM

    Hi Rob, I'm assuming you're working on this form https://www.jotform.com/61923262436354 and you're referring to the Animated Heading I found at the bottom of that said form:

    By default, the font color used on that widget is black. However, I noticed you haven't entered any text for your heading yet. You're right, you would need CSS to change the font color of the text. And here's the CSS codes you need to change it:

    .tt {

       color: #FFCC66;


    (I used the same color I found on the CSS section of the widget from your cloned form)

    And this is how it would look like:

    Hope that helped!

  • Profile Image
    Answered on July 13, 2016 at 10:56 AM


    Exactly what I needed

    Much appreciated :)