Flashlight Reveal
Uilora Flashlight Reveal — cursor-torch that illuminates hidden images in the dark.
Props
| Property | Type | Default | Description |
|---|---|---|---|
| images | string[] | [...12 image URLs] | Array of image URLs to display in grid. |
| backgroundColor | string | #000000 | #000000 Background color (hex, rgb, or hsl). |
| lensSize | number | 300 | Size of flashlight lens in pixels. |
| hintText | string | MOVE CURSOR TO ILLUMINATE THE UILORA ARCHIVE | Hint text displayed at bottom. |
When to Use
Excellent for mystery brands, technical archives, and Next.js platforms that want a dramatic 'Flashlight Reveal' aesthetic. Use this gallery for an immersive experience where images 'Illuminate' and activate based on cursor focus.
Best Practices
Follow React best practices by pairing this with dark-themed hero backgrounds. Maintain scalable component architecture by keeping the lens size balanced. Optimize for performance by managed the mask coordinates.
Why This Component Matters
Flashlight-based aesthetics communicate digital focus, discovery, and power. This Uilora-ready template helps you build an interface that feels advanced and high-end, adding a distinct archive signature to your brand.
FAQ
QHow does the 'Flashlight' work?
The component tracks the cursor to localized mask coordinates, creating a physical 'Beam' of light that follows the user across the dark feature grid.
QCan I change the intensity?
Yes, both the lens size and the primary background color can be adjusted to match your brand's specific environmental lighting.
QDoes it work with touch?
The flashlight responds to touch-move events, though it's most impactful as a mouse-driven cursor beam for high-fidelity desktop discovery.
Related Components
Editorial Layout
Asymmetric fashion-inspired bento grid with sharp edges and editorial styling, branded for Uilora.
Swiss Layout
Clean Swiss design bento grid with precise typography and minimal aesthetics, branded for Uilora.
Wabi Sabi Layout
Japanese-inspired bento grid with wabi-sabi aesthetics, imperfections, and Uilora branding.
