VideoHatch

Overview

Add a dynamic, scribbled hatching effect to your videos with VideoHatch. Powered by native Three.js WebGL, this component uses VideoTexture to convert any standard MP4 into a beautifully shaded, hand-drawn animation right on the canvas with incredibly smooth performance.

Features

- Real-time Video Textures: Applies real-time native WebGL shading to MP4 video textures.

- Original Color Sampling: Color sampling directly from the video source for full-color sketches.

- Interactive: Interactive hover triggers included.

- Customizable: Fully customizable stroke angles, spacing, and jitter for a hand-drawn look.

Use Cases

- Creative Portfolios

- Hero Backgrounds

Properties

- Video Settings: Source (URL or Upload), Playback Controls (AutoPlay, Loop, Muted), Video Fit, Trigger, Quality.

- Style: Original Color, Tint Color, Angle, Spacing, Line Width, Round Caps, Softness.

- Jitter: Angle Jitter, Offset Jitter, Spacing Jitter, Seed.

- Animation: Speed.

Customization

- Choose your Source (URL or Upload) and provide the video.

- Pick how you want the video to scale with Video Fit.

- Tweak the Style group to customize stroke look and color.

- Adjust the Jitter group to control randomness and hand-drawn feel.

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