> ## Documentation Index
> Fetch the complete documentation index at: https://mintlify.com/gradio-app/gradio/llms.txt
> Use this file to discover all available pages before exploring further.

# HighlightedText

> Display text with highlighted spans

The HighlightedText component displays text with spans highlighted by category or confidence value.

## Basic usage

```python theme={null}
import gradio as gr

def ner(text):
    # Returns list of (token, label) tuples
    return [
        ("The", None),
        ("Eiffel", "LOC"),
        ("Tower", "LOC"),
        ("is", None),
        ("in", None),
        ("Paris", "LOC")
    ]

gr.Interface(
    fn=ner,
    inputs=gr.Textbox(),
    outputs=gr.HighlightedText()
).launch()
```

## Constructor

<ParamField path="value" type="list[tuple[str, str | float | None]] | dict | Callable | None" default="None">
  Highlighted text as:

  * List of `(text, label)` tuples
  * Dict with `"text"` and `"entities"` keys (Hugging Face format)
</ParamField>

<ParamField path="color_map" type="dict[str, str] | None" default="None">
  Dictionary mapping labels to colors (e.g., `{"PER": "red", "LOC": "#00FF00"}`)
</ParamField>

<ParamField path="show_legend" type="bool" default="False">
  Whether to show category legend separately
</ParamField>

<ParamField path="show_inline_category" type="bool" default="True">
  If False, doesn't display label inline. Only applies when `show_legend=False`
</ParamField>

<ParamField path="combine_adjacent" type="bool" default="False">
  If True, merges adjacent tokens with same category
</ParamField>

<ParamField path="adjacent_separator" type="str" default="''">
  Separator between adjacent tokens when `combine_adjacent=True`
</ParamField>

<ParamField path="show_whitespaces" type="bool" default="True">
  If False, strips leading/trailing whitespace from tokens
</ParamField>

<ParamField path="rtl" type="bool" default="False">
  If True, displays text right-to-left
</ParamField>

## Events

* **change** - Triggered when highlighted text changes
* **select** - Triggered when span is selected

## Examples

### Named Entity Recognition

```python theme={null}
import gradio as gr

def ner_demo(text):
    # Simulated NER output
    entities = [
        ("Apple", "ORG"),
        (" announced the ", None),
        ("iPhone", "PRODUCT"),
        (" in ", None),
        ("2007", "DATE")
    ]
    return entities

gr.Interface(
    fn=ner_demo,
    inputs=gr.Textbox(),
    outputs=gr.HighlightedText(
        color_map={
            "ORG": "#FFD700",
            "PRODUCT": "#90EE90",
            "DATE": "#87CEEB"
        },
        show_legend=True
    )
).launch()
```

### Sentiment scores

```python theme={null}
import gradio as gr

def sentiment(text):
    # Returns (text, confidence) tuples
    words = text.split()
    return [(w, 0.9 if i % 2 == 0 else 0.3) for i, w in enumerate(words)]

gr.Interface(
    fn=sentiment,
    inputs=gr.Textbox(),
    outputs=gr.HighlightedText()
).launch()
```

### HuggingFace format

```python theme={null}
import gradio as gr

def ner_hf_format(text):
    return {
        "text": "Apple is a technology company",
        "entities": [
            {"entity": "ORG", "start": 0, "end": 5},
            {"entity": "TYPE", "start": 13, "end": 23}
        ]
    }

gr.Interface(
    fn=ner_hf_format,
    inputs=gr.Button("Analyze"),
    outputs=gr.HighlightedText()
).launch()
```


This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.