Text Hover Effect
A text hover effect that animates and outlines gradient on hover, as seen on x.ai
API
| Prop Name | Type | Default | Description |
|---|---|---|---|
text | string | Required | The text to be displayed with the hover effect. |
duration | number | 200 | The duration of the mask transition animation in seconds. |
strokeWidth | number | 0.75 | The width of the text stroke. |
opacity | number | null | The opacity of the text. |
Component Code
You can copy and paste the following code to create these components:
TextHoverEffect.vue