# Text Span in Weflow: Customize the Style of One or More Words

Tutorial3 minPublished on Mar 20, 2023Updated on ![text span feature in the webflow tool](https://cdn.prod.website-files.com/67053868fc01e494462e71c9/671177913022a637da45d8a4_64760069e93084646c9ef21f_63f7a68d56d8f1259c739446_Open-Graph-webflow-text-span.webp)Table of contents

[

Copied](#)[

](#)[

](#)[

](#)
- [H2 Example](#)

Use AI to summarize this article[

ChatGPT](#)[

Claude](#)[

Grok](#)[

Perplexity](#)[

Google AI](#)Key points**The Text Span** allows users to **style a specific part of a paragraph**. This can be particularly helpful when you want to highlight **a word or phrase** within a paragraph.

In this article, we will explore **the different steps** to give a unique style to any part of a text, distinguishing it from the rest of the content using the Text Span.

## How to use the Text Span in Webflow ?

- Select and double-click on the paragraph or heading where you want to customize the text
- Select the text you wish to modify (a word or group of words)
- A text formatting bar will appear above the selected text.

The formatting bar offers several options, including: **Bold**, Italic, Superscript, Subscript,

Insert Link, Wrap with span, Clear formatting

![Text Span customization options](https://cdn.prod.website-files.com/67053868fc01e494462e71c9/671177923022a637da45d99a_64760069e93084646c9ef0a4_63f8963a7424ed2039ca77c1_webflow%252520text%252520span%252520options.webp)

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

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

- Assign it a class > you will be able to reuse it on another selection

![Assigning class to a selection with Text Span](https://cdn.prod.website-files.com/67053868fc01e494462e71c9/671177923022a637da45d9a1_64760069e93084646c9ef0a5_63f895ef7d19ad4ebd4d9401_webflow%252520wrap%252520with%252520span.webp)
- Add more styles to your text using the style panel (on the right side of the designer)

![Customizing Text Span in Webflow](https://cdn.prod.website-files.com/67053868fc01e494462e71c9/671177923022a637da45d9a4_64760069e93084646c9ef0a6_63f89610487b98356f7534e1_webflow%252520text%252520span%252520edit.webp)

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

Don't forget to save to record your changes and publish.

### To clear any custom formatting :

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

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

Don't wait any longer to try Text Span and feel free to enhance your learning with the video tutorial offered by Florian on our YouTube channel.

[

](#)![Digidop](https://cdn.prod.website-files.com/67053868fc01e494462e71c9/670d65d7d25b0b7faea756ef_64760069e93084646c9ef274_icon-digidop.svg)DigidopWeb Agency[

](/team/digidop-team)[

](https://fr.linkedin.com/company/digidop)[

](https://x.com/digidop_com)+1200 readers

## Stay ahead of the curve!
Subscribe now for expert insights.

[Subscribe

](https://digidop.substack.com/subscribe)![Preview Digidop Newsletter](https://cdn.prod.website-files.com/6705382c85d21c496de94fa5/671231c436687e9d40d995e9_newsletter-digidop.webp)[Preview Newsletter

](https://digidop.substack.com/)

## Suggested articles

![Collage of homepages from B2B SaaS agencies including Digidop, Vydera, FlowNinja, OFF+BRAND, Yuri & Neil, MetaLab, Shakuro and Ramotion](https://cdn.prod.website-files.com/67053868fc01e494462e71c9/6ab922fa556f97c19ea7db9a_Best%20B2B%20SaaS%20Agencies%20in%202026_EN.webp)DocumentationAll blog post

### Top 20 Web & Digital Agencies for B2B SaaS in 2026

[Top 20 Web & Digital Agencies for B2B SaaS in 2026](/blog/best-b2b-saas-agencies)Top 20 Web & Digital Agencies for B2B SaaS in 2026![Webflow Source interface showing AI agents, website editing, and role-based Views in a unified workspace.](https://cdn.prod.website-files.com/67053868fc01e494462e71c9/6a9fa9f8608ffcc774c47eb7_source%20(1).webp)NewsDevelopmentAll blog post

### Webflow launches Source. Our take on this shift.

[Webflow launches Source. Our take on this shift.](/blog/webflow-launches-source)Webflow launches Source. Our take on this shift.![Citation rate by AI platform: ChatGPT 100%, Perplexity 100%, Gemini 67%, and Claude 0%.](https://cdn.prod.website-files.com/67053868fc01e494462e71c9/6a9044c13914f1d6ac3e9161_citation.jpg)DocumentationAIAll blog post

### Make Your Website Visible in ChatGPT, Perplexity, and AI Answers

[Make Your Website Visible in ChatGPT, Perplexity, and AI Answers](/blog/make-your-website-visible-in-chatgpt-perplexity-and-ai-answers)Make Your Website Visible in ChatGPT, Perplexity, and AI Answers[See all articles

](/blog)Every great website  
starts with a conversation[Talk to an expert

](/contact)[Book a call

](/calendly)![Abstract composition of black and gold metallic ribbons with elegant light reflections and smooth gradients. A premium background conveying luxury, modernity, and innovation.](https://cdn.prod.website-files.com/6705382c85d21c496de94fa5/6a69a346549deffabdf98afa_shape-cta-footer.webp)