Generator für körnige Textur (Noise) für Hintergründe
Passe das Korn an und sieh es über dem Hintergrund. Das SVG nutzt den Filter feTurbulence und bleibt bei wenigen Bytes; das PNG ist ein kleiner Block, der sich ohne sichtbare Naht wiederholt.
So geht’sFilmkorn für Hintergründe
Verfügbar auf: 
Generator für körnige Textur (Noise) für Hintergründe: wofür es gut ist
Eine leichte Körnungsschicht gibt glatten Hintergründen und Verläufen ein Aussehen wie Papier oder Film und kaschiert zudem die Streifen, die in sanften Verläufen erscheinen.
Passe Korngröße, Detail, Deckkraft und Mischmodus an und sieh das Ergebnis über einem Testverlauf. Kopiere das CSS mit dem Rauschen als SVG (Filter feTurbulence, mit wenigen Bytes und ohne Naht), angewendet auf ein Pseudo-Element, oder lade ein PNG mit 128, 256 oder 512 px zum Wiederholen im Hintergrund herunter.
So geht’s
- Passe Korn, Deckkraft und Mischung an.
- Teste über den Farben deines Hintergrunds.
- Kopiere das CSS oder lade das PNG herunter.
Wann nutzen
- Hero-Hintergrund mit Verlauf.
- Karten mit Papiertextur.
- Retro- oder Film-Look.
Häufige Fragen
Wozu dient die Körnung?
Eine leichte Rauschschicht nimmt glatten Hintergründen und Verläufen den Plastik-Look, macht den Look organischer und kaschiert zudem die Streifen, die in sanften Verläufen erscheinen (Banding).
SVG oder PNG?
Das SVG mit feTurbulence wiegt wenige Bytes und skaliert auf jede Größe, wird aber vom Browser gezeichnet und kann bei großen animierten Bildschirmen belasten. Das PNG ist ein kleiner, wiederholter Block, leicht zu zeichnen. Für einen festen Hintergrund funktionieren beide gut.
Wie viel Körnung nutze ich?
Wenig. Eine Deckkraft zwischen 5 % und 15 % gibt schon Textur, ohne die Seite zu verschmutzen; darüber beginnt der Hintergrund wie ein verrauschtes Foto zu wirken und stört das Lesen des Textes darüber.
Ist das wirklich kostenlos?
Ja, 100% kostenlos. Ohne Anmeldung, ohne Abo und ohne Nutzungslimit. Alle Tools von Tools123 sind kostenlos.