Skip to content

component

Tubelight

By Visual Mess Studio

Details

Summary

Tubelight is a shader-powered animated background component for Framer designed to add a subtle cinematic motion effect to modern websites.

Description

Tubelight is a shader-powered animated background component for Framer designed to add a subtle cinematic motion effect to modern websites. The component renders a glowing line that sweeps across the canvas, creating a dynamic lighting effect that feels immersive while remaining lightweight and performant. Because the animation is powered by WebGL shaders , it runs smoothly and scales beautifully across screen sizes. Tubelight is built as a flexible Framer component, allowing designers and developers to easily customize the visual style without touching any code. Customizable properties • Speed – Controls the overall movement speed of the animation• Amplitude – Adjusts the width and sweep of the light arc• Line Color – Changes the color of the glowing light strip• Background Color – Adjusts the environment behind the shader Best used for: Hero backgrounds, Landing pages, Portfolio websites, SaaS product pages, Section transitions, Event and campaign pages, Brand moments and interactive layouts Tubelight is designed to be minimal, performant, and visually striking, helping designers add motion and atmosphere to their websites without complex animations. Tubelight Framer Component Image Tubelight Framer Component Image Tubelight Framer Component Image Tubelight Framer Component Image Tubelight component guide

Introduction

A dynamic WebGL light effect component

Rank history

Daily rank per list, from the first snapshot — lower is better.

120014001600174838/148/228/309/79/15
  • All · #7483