---
title: "Rainbow Brush — Framer component · Best of Framer"
description: "$9.00 · Framer component · by Nabeel · Effects. About A mouse component that renders rainbow-colored strokes following mouse movement."
canonical: "https://framer.elliotli.dev/component/rainbow-brush"
---

[Home](/)/[Components](/components)/[Effects](/components/category/effects)/Rainbow Brush

# Rainbow Brush

[View on Framer](https://framer.com/marketplace/components/rainbow-brush/?via=elliot-li)

![Rainbow Brush preview image 1](https://framer.elliotli.dev/og/component/rainbow-brush/3562f06114ad058e/1600x1200.jpg)

## Summary

About A mouse component that renders rainbow-colored strokes following mouse movement.

## Description

## About

A mouse component that renders rainbow-colored strokes following mouse movement. Supports two interaction modes: hover (automatic drawing as the mouse moves) or click-and-drag (drawing only while pressing). Features adjustable line thickness, color transition speed, and optional fade-out effects.

This component a part of the 400+ components, layouts, templates, UI Kits and code overrides from SegmentUI PRO. Click [here](https://segmentui.com/uikit) to see the full library

## Instructions

1.  Copy and paste the RainbowBrush component into your project file
    
2.  Ensure that the component is sized properly
    
3.  Customize the behaviour via property controls
    
    -   Adjust the line width and background color to match your design
        
    -   Choose between hover or press interaction in the properties panel
        
    -   Set the rainbow gradient speed for color transitions
        
    -   Toggle the disappear effect and adjust its delay if desired
        
    -   Fine-tune the elasticity for more dynamic strokes
        
4.  Preview
    

## How It Works

![](https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/components/description-image-qsgu2q26-GNQnpHDMwOUkzAGm2QIBIZxQmTel3C)

The component uses several key properties:

-   Basic settings (line width, background color)
    
-   Interactive controls (hover/press, rainbow speed)
    
-   Dynamic effects (disappearing lines, elasticity)
    
-   Time controls (fade delay, animation speed)
    

## Support

For any queries and help setting up the component, contact [hello@segmentui.com](mailto:hello@segmentui.com)

## Rank history [How rankings work →](/terms#rankings)

-   All · #10626

## Details

- **Author**: Nabeel
- **Price**: $9.00
- **Published**: 2025-08-13
- **Updated**: 2025-08-13
- **Added**: 2025-08-08
- **Categories**: Effects

## More like this

-   [Liquid Glass Loupe](/component/liquid-glass-loupe) — Aisol Studio · $12 — Liquid glass lens over content
-   [Sticky Scenes](/component/sticky-scenes) — Sofía Martín · $5 — Scroll-driven stories with sticky
-   [Studio ASCII Reveal](/component/studio-ascii-reveal) — Tanmay Kaper · $12 — Your portrait, redrawn in ASCII
-   [Kinetic Sprout](/component/kinetic-sprout) — Buster Studios · $19 — A headline that grows