DARMOWE NARZĘDZIE

Generator CSS filtrów

Twórz filtry CSS (blur, brightness, contrast, grayscale, sepia, hue-rotate) z podglądem na żywo i kopiuj gotowy kod. Online, bezpłatnie. 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

Preview tekstu

62 znaków

Class nazw

Grayscale

Sepia

Blur

Brightness

Contrast

Saturate

Hue rotate

Invert

Opacity

Drop shadow x

Drop shadow y

Drop shadow b

Drop shadow c

Pro mode Opcja narzędzia

Respect reduce motion 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ć

Generator CSS filtrów online

Właściwość CSS filter pozwala stosować efekty fotograficzne bezpośrednio w przeglądarce — bez Photoshopa, bez canvas. Generator łączy filtry z podglądem na żywo.

CSS filter blur CSS efekty obrazu CSS photo effects CSS

Dostępne filtry

blur (rozmycie), brightness (jasność), contrast, grayscale (skala szarości), sepia, hue-rotate (przesunięcie barwy), invert, saturate, opacity — każdy z suwakiem.

Łączenie filtrów

Możesz połączyć dowolną liczbę filtrów w jednej deklaracji: filter: blur(2px) brightness(1.2) sepia(0.3) — generator pilnuje kolejności i składni.

Najczęstsze pytania

Czy filtry wpływają na wydajność?

Filtry są renderowane przez GPU, więc są szybkie. Unikaj blur na dużych elementach z animacją — może obciążyć słabsze urządzenia.

Jak zrobić hover z filtrem?

Dodaj :hover { filter: … } z transition: filter 0.3s — narzędzie opcjonalnie generuje ten wariant.

Czy filtry działają na video?

Tak — CSS filter działa też na elementy

Do manipulacji kolorami sprawdź też konwerter HEX/RGB/HSL w serwisie.