DiagonalScrollFade

DiagonalScrollFade

About DiagonalScrollFade

# DiagonalScrollFade Component

Create stunning diagonal fade effects that respond to scroll position. Perfect for hero sections, text reveals, and creating depth in your designs.

## ✨ Features

- Progressive Diagonal Fade - Content fades from top-left to bottom-right as users scroll

- Customizable Fade Range - Control exactly when the fade starts and ends

- Adjustable Angle - Change gradient direction from 0 to 360 degrees

- Works with Any Content - Apply to text, images, components, or entire sections

- Smooth Performance - GPU-accelerated animations for buttery-smooth scrolling

- Reverse Mode - Optionally fade from bottom-right to top-left

## 🎯 Use Cases

- Hero section text reveals

- Image galleries with scroll effects

- Progressive content hiding

- Creating visual hierarchy

- Portfolio showcases

- Storytelling websites

## ⚙️ Properties

- Fade Start - Pixel position where fade begins

- Fade End - Pixel position for complete fade

- Gradient Angle - Direction of fade (default: 45°)

- Fade Intensity - Control opacity strength

- Reverse Direction - Flip the fade direction