Skip to content

component

Dither Interactive

By Dhexy MW

Details

Summary

Interactive Fluid Image Component

Description

Dither Halftone Fluid Image turns any image into a real-time, ordered-dithered dot grid — right inside Framer, no external plugins. Built on a 4x4 Bayer dithering algorithm, it renders luminance-based dot sizing for a clean, print-inspired halftone look, then brings it to life with cursor-reactive spring physics: dots near the pointer glide away radially and ease back smoothly once the cursor leaves. Every part of the effect is tunable from the property panel — grid resolution, dot size, dither intensity, hover radius, displacement strength, and the spring's stiffness and damping — so you can dial in anything from a subtle print texture to an exaggerated liquid-dot distortion. The canvas resizes cleanly with its container at any breakpoint. Note: cursor interaction is desktop/mouse-based; on touch devices the dot grid renders but does not currently react to touch. Features: Real-time ordered (Bayer 4x4) dithering engine Luminance-based dot sizing from any uploaded image Cursor-reactive spring physics displacement (desktop/mouse only) Adjustable grid resolution, dot size, and dither amount Configurable hover radius and displacement strength Custom spring stiffness and damping controls Custom dot color and background color Responsive, resize-aware canvas layout Fully structured, ready-to-use property controls Refund Policy Due to the nature of digital products, we do not offer refunds once a purchase is made. If you have any questions before making a purchase, please reach out to us at dhexy.support@gmail.com

Introduction

Interactive Fluid Image Component

Rank history

Daily rank per list, from the first snapshot — lower is better.

120014001600178338/148/228/309/79/15
  • All · #7620