Components
Text Reveal
Brightens its words one by one as the element scrolls up through the viewport.
php artisan blatui:add text-reveal
BlatUI components reveal themselves as you scroll — accessible, token-driven, and yours to own.
<x-ui.text-reveal class="max-w-xl text-center text-2xl font-semibold tracking-tight text-balance">
BlatUI components reveal themselves as you scroll — accessible, token-driven, and yours to own.
</x-ui.text-reveal>
API Reference
Props, slots and exposed methods for
<x-ui.text-reveal>.
Props
| Prop | Type | Default | Description |
|---|---|---|---|
as |
string
|
'p'
|
The wrapper HTML tag to render (sanitized to alphanumerics, falling back to "p"). |
Slots
| Slot | Description |
|---|---|
default |
The text to reveal. It is split into words that dim, then brighten one by one as the element scrolls up through the viewport. The full text is server-rendered at full opacity, so no-JS readers and crawlers get everything; it stays fully revealed under prefers-reduced-motion. |