Text Span allows users to style a specific part of a paragraph. This can be especially useful when you want to highlight a word or phrase in a paragraph.

In this article we will see the different steps to give a different style to any part of a text differently from the rest of the text thanks to the Text Span.

How to use the Text Span in Webflow?

• Select and double-click on the paragraph or heading in which you want to customize the text
• Select the text to be modified (a word or group of words)
• A text formatting bar will appear above the selected text.

Several options are offered by the formatting bar, such as: Bold, Italic, Superscript, Subscript,

Insert Link, Wrap with span, Clear formatting

Click on one or more formatting options in the text formatting bar to apply it to your selected text

If you choose Wrap with span: the selected word or group of words will appear as Text Span

• Give it a class > you will be able to reuse it on another selection

• Add other styles to your text using the styles panel (on the right of the designer)

If you want to add a second Span Text, repeat the steps above.

Don't forget to save your changes and publish.

To clear any custom formatting:

• Double-click on the text element
• Select the formatted text
• Click on Clear formatting

Using Text Span in Webflow, you now have the ability to customize the style of a specific word or group of words within a single text box. This will allow you to highlight key elements of your content, reinforce your message and create a more effective and visually appealing text design for your users.

Don't wait any longer to test the Text Span and don't hesitate to complete your learning with the video tutorial proposed by Florian on our Youtube channel