How can I change the link span text color to match the color defined in the CMS Collection Content Container in Webflow?
Published on
September 22, 2023
To change the link span text color to match the color defined in the CMS Collection Content Container in Webflow, you can follow these steps:
- Identify the class or element that contains the link span text that you want to change the color of.
- Go to the Styles panel in Webflow.
- Select the appropriate class or element.
- Locate the Typography section in the Styles panel.
- Click on the small colored box next to the "Text" or "Link Text" property to open the color picker.
- In the color picker, click on the "Dynamic" tab.
- From the dropdown menu, select the CMS Collection Content Container that contains the color value you want to use.
- Webflow will automatically generate a dynamic color reference like
{color-variable-name}
. - Save the changes and publish your site.
By using the dynamic color reference, the link span text color will now match the color defined in the CMS Collection Content Container. Whenever you change the color in the CMS Collection, the link span text color will automatically update to reflect the new value.
Note: Make sure that the CMS Collection Content Container has a defined color value for the link span text. If it doesn't, you will need to set a color value in the CMS Collection first before being able to reference it in the link span text.
Additional Questions
- How do I create a CMS Collection Content Container in Webflow?
- Can I use multiple CMS Collection Content Containers on one page in Webflow?
- What other dynamic references can I use in Webflow to customize my site's design?