Spotlight Reveal BG

Elevate your Framer site with the Stealth Spotlight.

Modern tech websites rely on subtle, high-end interactions to stand out. The Stealth Spotlight is a plug-and-play code component that adds a buttery-smooth, glowing mouse-reveal effect to your backgrounds. It stays pitch black until the user interacts, creating a deeply engaging "flashlight" effect over a precise architectural grid.

Why you'll love it:

• Zero Design Required: Drop it onto your canvas and it works instantly.

• Highly Customizable: Switch between precise Lines or modern Dots. Dial in your exact grid size, dot thickness, and custom brand colors right from the Framer properties panel.

• Flawless Performance: Built natively with Framer Motion and optimized CSS masking. It runs at a perfect 60FPS with zero lag, ensuring your site stays lightning-fast.

• Smart Canvas: The grid remains fully visible inside the Framer Editor so you can design effortlessly, but switches to "stealth mode" the second you hit publish.

• Integrated Typography: Includes built-in, customizable text overlays that sit perfectly above the interaction.

How to use it:

1. Drag the component onto your canvas and set width/height to 100%.

2. Tweak the colors and grid type in the right-hand panel.

3. Hit preview and watch it glow.

4. Component Configuration (Feature Checklist)

If the platform asks you to list the included features or properties.

• Grid Type Selector: Toggle between Lines, Dots, or None.

• Grid Density: Sliders for Grid Spacing and precise Dot Size.

• Spotlight Physics: Adjustable Glow Radius and Edge Softness.

• Color Controls: Custom Background, Grid, and Text colors.

• Custom Override: Ability to connect custom native Framer frames to be revealed by the spotlight.

5. Deliverables (What the user gets)

• 1x Framer Remix Link (containing the fully set up component and a demo landing page).