The FilmStrip component is a cinematic asset designed for photographers and designers who want to showcase their visual work with a nostalgic, high-end feel. It transforms standard image galleries into an interactive, scrolling film reel that adds depth and movement to any Framer project.
Tailor every aspect of the reel to fit your brand’s aesthetic using the extensive property panel:
Layout & Direction: Switch between Vertical or Horizontal orientations and set the scroll Direction to Forward or Backward.
Animation: Toggle Motion on/off and fine-tune the scrolling Speed (s) for a smooth or high-energy effect.
Frame Styling: Adjust Frame Width (Frame W), Frame Radius, and Frame Gap to control spacing between shots.
Visual Fidelity: Enable Shadow for depth, customize the Strip Color, and use Fade Width to create soft transitions at the edges of the component.
Perforation Details: Get granular with the "film" look by adjusting Perf Height, Hole Width (Hole W), Hole Height (Hole H), and Hole Radius.
Aspect Ratio: Use the Lock Ratio toggle and Aspect Ratio slider to ensure your images maintain their perfect proportions.
Initial Configuration: When you first add the FilmStrip component to your canvas, it will be empty and will not display any default visuals. You must manually add your own assets by clicking the Images property in the sidebar and uploading your files individually to populate the reel.
The FilmStrip component is a cinematic asset designed for photographers and designers who want to showcase their visual work with a nostalgic, high-end feel. It transforms standard image galleries into an interactive, scrolling film reel that adds depth and movement to any Framer project.
Tailor every aspect of the reel to fit your brand’s aesthetic using the extensive property panel:
Layout & Direction: Switch between Vertical or Horizontal orientations and set the scroll Direction to Forward or Backward.
Animation: Toggle Motion on/off and fine-tune the scrolling Speed (s) for a smooth or high-energy effect.
Frame Styling: Adjust Frame Width (Frame W), Frame Radius, and Frame Gap to control spacing between shots.
Visual Fidelity: Enable Shadow for depth, customize the Strip Color, and use Fade Width to create soft transitions at the edges of the component.
Perforation Details: Get granular with the "film" look by adjusting Perf Height, Hole Width (Hole W), Hole Height (Hole H), and Hole Radius.
Aspect Ratio: Use the Lock Ratio toggle and Aspect Ratio slider to ensure your images maintain their perfect proportions.
Initial Configuration: When you first add the FilmStrip component to your canvas, it will be empty and will not display any default visuals. You must manually add your own assets by clicking the Images property in the sidebar and uploading your files individually to populate the reel.
Sourav D
