reflex/docs/library/chakra/typography/highlight.md
2024-02-26 17:18:28 +01:00

21 lines
509 B
Markdown

---
components:
- rx.chakra.Highlight
---
```python exec
import reflex as rx
```
# Highlight
The highlight component take in a string and display some of the words as highlighted text.
The words to highlight can be selected using the `query` prop.
You can also customize how the hightlight will be rendered with the `styles` prop.
```python demo
rx.chakra.highlight("Hello World, we have some highlight", query=['World','some'], styles={ 'px': '2', 'py': '1', 'rounded': 'full', 'bg': 'grey' })
```