Unable to change the colour of text

Design help Animations & Interactions
1

Hello,

I purchased a template and have been able to customize it nicely so far, but have no idea how to change the orange accent when you click some of the elements on the website (such as an accordion element). I’m not sure if maybe this is like a brand color that’s been set somewhere that I don’t know to look? Please help, thank you :slight_smile:
Read only link is below… you can’t see the orange text on there though, if you go to https://ace-website-90210c.webflow.io/ and scroll down to the “How can we help?” section, you’ll see the accordion clicks to an orange text color

Here is my public share link: [LINK](Webflow - ACE Business Essentials)
(how to access public share link)

2

Not sure what you mean by accordion element.
Are you referring to the animated line under text links when you hover over them?
The line that turns from grey to orange?

3

Hi Bart,
That too, yes! There are little animations all over the site that use that same orange color, which I would like to keep but want to change to a different color. The accordion I was referring to is under the “How can we help?” section on the home page, named “Auto Tab Link” in designer. I’m completely new at web design, hopefully this makes sense. Thank you so much!

4
  1. Select the “Auto Tab Link” element.
  2. On the right-side menu (Style, Settings, Interactions) click “Interactions”.
  3. Below “Element trigger” you will see the animation named “Tab change”, click on it.
  4. Now, below “Tab change” you will see “Tab in view” in bold, with a long list of all the animations present on your site. Scroll down until you see the animation “Tab Content Hide IN”. (This animation should be highlighted with a filled white circle next to it and outlined with a blue box) This is the animation you want to edit.
  5. Click “Tab Content Hide IN” and now below “Actions” you will see the two actions for the “Heading Tab” text color.
  6. The second “Heading Tab” text color action is the one changing the text color to orange. Click on it and scroll down. Below “Typography” click the color swatch to edit the color :slight_smile:
  7. Click the “Done” button (top right) to save your edit.

**Webflow currently has an issue with interactions/animations/actions not supporting color variables (assigned color swatches). So you will have to repeat a similar process for each interaction/animation/action that involves a color you want to edit. Personally, I have a text document open with the color-hex-code to copy and then paste into the actions color picker.
This sucks for all Webflow users.

See this post:

5

You’re an absolute life-saver!! I can’t thank you enough. This worked and I was able to fix all the orange animations on my site. THANK YOU :pray:

1 Like
6

You’re welcome! I’m glad it was the solution you were looking for. :slight_smile: