A single line of text that runs across its container without end, fading at both edges and pausing under the pointer. Small caps for announcements, tracked serif for statements.
The import and the props worth knowing about, in one place.
import { Text15 } from "@/components/beste/component/text15";
<Text15
text="Therapy and coaching, in the room or online"
separator="·"
duration={28} // seconds per pass
direction="left" // or "right"
className="text-sm uppercase tracking-[0.25em] text-muted-foreground"
/>Turn the props on the right; the snippet under them is what you would write to get what you see.
import { Text15 } from "@/components/beste/component/text15";
<Text15
text="Therapy and coaching, in the room or online"
className="px-0 text-sm uppercase tracking-[0.25em] text-muted-foreground"
/>Every one of these is in the component already. They are listed because a props table cannot mention a gesture, so nothing else on this page can tell you they exist.
| Hover the line | The run pauses while the pointer is over it, so a link or a long announcement can be read. |
|---|
Read from the component's own type, so this cannot drift from what it accepts.
| Prop | Type | Default | Description |
|---|---|---|---|
text* | string | — | The line that runs; it is repeated so the loop never shows a gap |
separator | string | — | Separator printed between repeats |
duration | number | — | Seconds for one full pass |
direction | "left" | "right" | — | Run right to left (default) or left to right |
pauseOnHover | boolean | — | Pause while hovered |
className | string | — |
Lines of text that rise into view out of their own clipped rows, one after another, the way a heading is unmasked line by line.
A sentence that corrects itself: a line is drawn through the old word from left to right, and the better word settles in beside it out of a soft blur.
An inline phrase whose hairline underline draws itself in from the left when it scrolls into view. Drop it inside a heading or a sentence to mark the words that matter.
A line of text set around a circle that turns slowly, with room in the middle for an initial, an icon or a short word. A seal for corners, footers and hero edges.