TextRing
VERSION2.4.0
LICENSEMIT
CONFIG8 Options
Rotates text around the cursor position.
Installation
pnpm add @supermousejs/labsUsage
import { TextRing } from '@supermousejs/labs';
app.use(TextRing({ text: 'LOADING • ', radius: 40 }));Configuration
* Reactive Property| Option | Type | Default | Description |
|---|---|---|---|
| text * | string | 'SUPERMOUSE • SUPERMOUSE • ' | Text content. |
| radius * | number | 60 | Ring radius in pixels. |
| fontSize * | number | 12 | Text size in pixels. |
| speed * | number | 30 | Rotation speed in degrees per second. |
| color * | string | 'currentColor' | Text color. |
| opacity * | number | 1 | Opacity of the rendered ring container. |
| className | string | '' | Optional CSS class added to the container. |
| spread | boolean | true | Stretch the text to fit the entire circle using cross-browser letter-spacing. |