---
title: "LEDMatrix — Framer component · Best of Framer"
description: "$24.00 · Framer component · by Snoweirdo · Text. It's designed to be a highly customizable design element for your projects, featuring a variety of visual effects, style presets…"
canonical: "https://framer.elliotli.dev/component/ledmatrix"
---

[Home](/)/[Components](/components)/[Text](/components/category/text)/LEDMatrix

# LEDMatrix

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

![LEDMatrix preview image 1](https://framer.elliotli.dev/og/component/ledmatrix/b5074948a4ae660c/1600x1200.jpg)

## Summary

It's designed to be a highly customizable design element for your projects, featuring a variety of visual effects, style presets, and interactive options.

## Description

It's designed to be a highly customizable design element for your projects, featuring a variety of visual effects, style presets, and interactive options.

## Available Controls

-   **Content**
    
    -   **Text**: A string input to define the text displayed on the LED matrix. The component automatically translates capital letters, numbers, and some special characters into their pixel-art equivalents.
        

-   **Styling**
    
    -   **Style Preset**: A dropdown to quickly apply a predefined color theme, such as "neon," "cyberpunk," "retro," or "ice."
        
    -   **LED Color**: Sets the color for the lit LEDs. This control is only visible when the Style Preset is set to "Default."
        
    -   **Hover Color**: Sets the color of the LEDs when the mouse hovers over the component. This is also only available in the "Default" preset.
        
    -   **Background**: Sets the background color of the component.
        
    -   **Border Color**: Sets the color of the border around the LED matrix.
        
    -   **Off-LED Brightness**: Adjusts the brightness of the unlit LEDs, giving them a subtle glow.
        
    -   **LED Intensity**: Controls the intensity of the lit LEDs.
        
    -   **Glow Effect**: A toggle to enable or disable a drop-shadow glow effect on the LEDs.
        

-   **Animations**
    
    -   **LED Animation**: A toggle to enable or disable a subtle flickering animation on the lit LEDs.
        
    -   **Animation Speed (ms)**: Defines the duration of the LED animation in milliseconds.
        
    -   **Glitch Effect**: A toggle to enable or disable a visual glitch effect.
        
    -   **Glitch Intensity**: Controls how frequently the glitch effect occurs.
        
    -   **Scrolling Marquee**: A toggle to enable or disable a marquee-style scrolling text effect.
        
    -   **Scroll Speed**: Controls the speed of the scrolling text.
        

-   **Interactivity**
    
    -   **Link URL**: A string input for a URL, making the component clickable.
        
    -   **Open in New Tab**: A toggle to determine whether the link opens in a new browser tab.
        

-   **Layout**
    
    -   **Border Radius**: Sets the radius of the component.
        
    -   **Padding**: Adjusts the space between the content and the component's border.
        

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

-   All · #11156

## Details

- **Author**: Snoweirdo
- **Price**: $24.00
- **Published**: 2025-08-21
- **Updated**: 2025-08-24
- **Added**: 2025-08-14
- **Categories**: Text

## More like this

-   [Hover Stretch Text](/component/hover-stretch-text) — 584.studio · $3 — Responsive & fully customizable
-   [Type Write Effect](/component/type-write-effect) — Russet Supply · Free — Animated Text & Interactive Typing
-   [Odometer Stats](/component/odometer-stats) — Pixlify · Free — Rolling number counters
-   [Clipped Words](/component/clipped-words) — Interface Studio · $5 — Words With a Little Chaos