Can Webflow allow for the addition of a stroke to text for an editable CMS title?

Webflow does not have a built-in option to add a text stroke (outline) to CMS text directly, but you can achieve this effect using custom CSS. Below are the steps to do it.

1. Use Custom CSS for Text Stroke

• Webflow does not provide a text-stroke option in its UI, but you can use the -webkit-text-stroke property via custom code.
• Add this CSS inside Page Settings > Custom Code > Head Code or using an Embed element:
• Example CSS:
  • h1 { -webkit-text-stroke: 2px black; color: white; }
• Adjust Values:
• Change 2px to modify stroke thickness.
• Change black and white to fit your design.

2. Apply the Class to Your CMS Title

• Give your CMS title element a specific class (e.g., cms-title).
• Modify the CSS to target this class:
• .cms-title { -webkit-text-stroke: 2px black; color: white; }
• This ensures that only CMS-driven text receives the outlined effect.

3. Use a Text Shadow Alternative (Fallback)

• Some browsers may not support -webkit-text-stroke.
• Use text-shadow as an alternative:
• .cms-title { text-shadow: 2px 2px 0px black; }
• This creates a similar outline effect without explicit stroke styling.

Summary

Although Webflow lacks a built-in text stroke option, you can use -webkit-text-stroke or text-shadow via custom CSS to outline CMS text dynamically. Apply these styles by adding them to the Page Settings > Head Code or an Embed element for easier control.