Feb 11, 2025

Dot Machine v.1

Dot Machine is a Framer component that pixelates a video, transforming it into a pixelated effect with customizable shapes, sizes, and colors. It takes a video URL as input and displays it with pixelated rendering.

Main Features:

- Pixelated Video: The component loads a video and applies a pixelated effect, where each pixel is either a square or circular shape with customizable colors.
- Color Balancing: You can hide specific colors and adjust tolerance with the tolerance, color1, color2, hideColor1, and hideColor2 props.
- Dynamic Sizing: The canvas size adjusts dynamically according to the parent element's size.


Customization:

- Shapes: Choose between circular or square pixels.
- Colors: Customize pixel colors with color1 and color2.
- Video Controls: Mute or loop the video with mute and loop props.