DARMOWE NARZĘDZIE

Generator Matrix Code / Rain Animation

Generuj ikoniczną animację deszczu kodu Matrix (zielone znaki spływające w dół). Canvas JS lub CSS. Konfiguruj prędkość i kolory. Profesjonalne narzędzie online, które działa w Twojej przeglądarce. Szybko, bezpiecznie i bez instalowania zbędnego oprogramowania.

Bezpieczne (SSL)

Przetwarzanie Lokalne

100% Darmowe

Przejdź do narzędzia

Instrukcja

1

Wprowadź dane
Wpisz treść, wklej tekst lub załaduj plik z dysku.
2

Kliknij przycisk
Narzędzie natychmiast przetworzy Twoje dane w przeglądarce.
3

Pobierz wynik
Skopiuj gotowy tekst lub zapisz plik na urządzeniu.

                                                function runTool() {

                                                  return "Wynik gotowy w 0.1s";

                                                }

Ustawienia

Charset

Szerokość

Wysokość

Font size

Speed

Fade

Glow strength

Tekstu kolorów

7 znaków

Bg kolorów

Glow Opcja narzędzia

Fullpage Opcja narzędzia

Wynik

Ustaw parametry i kliknij „Przetwórz”, aby zobaczyć wynik.

Powiązane narzędzia

Inne narzędzia, które mogą Ci się przydać

Animacja deszczu kodu Matrix online

Ikoniczna animacja zielonych znaków spływających po ekranie z filmu Matrix. Generator tworzy kod JavaScript Canvas lub CSS z pełną konfiguracją kolorów, prędkości i znaków.

Matrix code rain zielony deszcz kodu animacja Matrix Canvas JavaScript

Konfiguracja animacji

Prędkość spływania, gęstość znaków (kolumny), zestaw znaków (katakana japońska, cyfry binarne, znaki ASCII, mieszane), kolor pierwszoplanowy (klasyczna zieleń lub custom), kolor tła (czarny lub semi-transparent).

Format kodu

Vanilla JavaScript z Canvas 2D (wydajny, 60 FPS), CSS-only (ograniczone ale bez JS), React komponent, gotowy snippet z możliwością osadzenia jako tło strony.

Najczęstsze pytania

Jak efekt Matrix działa technicznie?

Tablica kolumn, każda z pozycją Y spływającego ciągu. Na każdej klatce: narysuj semi-transparent czarne tło (efekt zanikania), rysuj nowy znak na pozycji Y, przesuń Y w dół. Reset na końcu ekranu.

Czy animacja wpływa na wydajność?

Canvas requestAnimationFrame jest zoptymalizowany. Na starszych urządzeniach ogranicz kolumny lub zmniejsz rozmiar fonta.

Jakie znaki użył oryginalny Matrix?

Katakana japońska + cyfry + znaki specjalne – zaprojektowane przez Simon Whiteley.

Inne efekty animacji: efekt god rays i generator konfetti.