component
TextHatch
By FramerHub.io

Details
- FramerHub.io Author
- componentType
- $9.00Price
- 2026-08-01Published
- 2026-08-06Updated
- 2026-08-01Added
- TextCategories
Summary
Hand-drawn hatching shader effect
Description
Overview Apply a stunning, dynamic WebGL hatching and scribble effect directly to your typography with incredibly smooth native Three.js performance. Features Native WebGL Effect : Smooth Three.js shading right on the canvas. Custom Fonts : Fully supports Framer's extended font controls. Interactive : Built-in hover triggers for animated reveals. Customizable : Adjust angle, spacing, jitter, and colors. Use Cases - Hero Headlines - Creative Portfolios - Artistic Accents Properties - Text : The string to be rendered - Font : Extended font controls - Trigger : Always or On Hover - Style : Color, Angle, Spacing, Line Width, Round Caps, Softness - Jitter : Angle Jitter, Offset Jitter, Spacing Jitter, Seed - Animation : Speed Customization - Choose the font, text, and quality setting. - Tweak the Style group to set the base hatch angle, spacing, and width. - Adjust the Jitter group to add randomness for a hand-drawn look. License Single Use License — Use in one client project with full commercial rights. No redistribution. 1 license = 1 client. Refund Policy Due to the nature of our digital products, we are unable to offer refunds, but we're here to assist you with any questions or concerns! Version 1.0.0
Introduction
Hand-drawn hatching shader effect
Rank history
Daily rank per list, from the first snapshot — lower is better.
- All · #7898