TuffLogoStroke
Stroke animation for the current Tuff logo SVG, with once, breathe, and hover trigger modes.
TuffLogoStroke
Stroke animation for the current Tuff logo SVG, with once, breathe, and hover trigger modes.
Animation modes
Modes
Demo loads on client.
Palette and duration customization
Palette
Demo loads on client.
API
Props
| Name | Type | Default | Description |
|---|---|---|---|
size | string | number | 120 | Icon width and height |
mode | 'once' | 'breathe' | 'hover' | 'loop' | 'once' | Animation mode (loop is an alias for breathe) |
durationMs | number | 2200 | Animation duration (ms) |
strokeColor | string | #4C4CFF | Outer stroke color |
fillStartColor | string | #199FFE | Start color of core gradient |
fillEndColor | string | #810DC6 | End color of core gradient |
outerStartColor | string | #D73E4D | Start color of outer ring gradient |
outerEndColor | string | #7F007F | End color of outer ring gradient |
Was this helpful?