DESCRIPTION:
Stroke Text is a lightweight, hover-reactive text component with a clean outlined style that fills solid on interaction. Built for headers, nav links, buttons, and callouts that need a bold, editorial feel without extra layers or scripting.
FEATURES:
- Native Link control with new-tab toggle
- Full Font control (family, size, weight, spacing, line-height)
- Left / Center / Right text alignment
- Custom stroke color and width
- Custom hover fill color and letter-spacing
- Adjustable transition duration and easing
- Background color control
- Responsive: supports Fixed, Fit, and Fill sizing, with text wrapping
- Keyboard-accessible focus state
- Cross-browser stroke rendering, with automatic fallback for browsers that don't support native text-stroke
- Optimized for canvas and export, no background processes
WHERE TO USE:
- Navigation bars and menu links
- Hero headings and section titles
- Buttons and call-to-action links
- Footer links and social labels
- Portfolio and agency sites wanting a bold, minimal look
HOW TO USE:
Drag the component onto your canvas.
Type your text in the Text field.
Add a URL under Link if it should be clickable, and toggle New Tab if needed.
Adjust Font, Align, Stroke, Fill (Hover), Transition, and Background to match your design.
Resize the layer freely — text wraps automatically.
REFUND POLICY:
Due to the digital nature of this product, all sales are final and non-refundable. If you run into a bug or have a question before purchasing, reach out first and I'll help.
Support: acreziodesmond@gmail.com
DESCRIPTION:
Stroke Text is a lightweight, hover-reactive text component with a clean outlined style that fills solid on interaction. Built for headers, nav links, buttons, and callouts that need a bold, editorial feel without extra layers or scripting.
FEATURES:
- Native Link control with new-tab toggle
- Full Font control (family, size, weight, spacing, line-height)
- Left / Center / Right text alignment
- Custom stroke color and width
- Custom hover fill color and letter-spacing
- Adjustable transition duration and easing
- Background color control
- Responsive: supports Fixed, Fit, and Fill sizing, with text wrapping
- Keyboard-accessible focus state
- Cross-browser stroke rendering, with automatic fallback for browsers that don't support native text-stroke
- Optimized for canvas and export, no background processes
WHERE TO USE:
- Navigation bars and menu links
- Hero headings and section titles
- Buttons and call-to-action links
- Footer links and social labels
- Portfolio and agency sites wanting a bold, minimal look
HOW TO USE:
Drag the component onto your canvas.
Type your text in the Text field.
Add a URL under Link if it should be clickable, and toggle New Tab if needed.
Adjust Font, Align, Stroke, Fill (Hover), Transition, and Background to match your design.
Resize the layer freely — text wraps automatically.
REFUND POLICY:
Due to the digital nature of this product, all sales are final and non-refundable. If you run into a bug or have a question before purchasing, reach out first and I'll help.
Support: acreziodesmond@gmail.com