CSS-text-shadow-Generator

Passen Sie Versatz, Weichzeichnung und Farbe eines CSS-Textschattens an und erhalten Sie sofort den passenden text-shadow-Wert samt Live-Vorschau. Berechnung 100% lokal in Ihrem Browser – nichts wird an einen Server gesendet.

Beispiele:
Vorschau
CSS-Code

So funktioniert es

Die CSS-Eigenschaft text-shadow akzeptiert einen horizontalen Versatz, einen vertikalen Versatz, einen optionalen Weichzeichnungsradius und eine Farbe. Mit diesem Tool stellen Sie jeden Wert über Regler ein und sehen das Ergebnis sofort an einem Demotext – so gestalten Sie einen Relief-, Leucht- oder Retro-Effekt, ohne die Werte von Hand zu erraten.

Kann ich mehrere Schatten auf denselben Text legen?

Ja, die Eigenschaft text-shadow akzeptiert mehrere durch Kommas getrennte Angaben (zum Beispiel für einen Neon-Effekt mit mehreren überlagerten Lichthöfen). Dieses Tool erzeugt jeweils nur einen Schatten; Sie können das Ergebnis kopieren und bei Bedarf von Hand mit weiteren Werten kombinieren.

Wie erreiche ich einen überzeugenden „Neon“-Effekt?

Setzen Sie den horizontalen und den vertikalen Versatz auf 0, erhöhen Sie die Weichzeichnung deutlich und wählen Sie eine leuchtende Farbe auf dunklem Hintergrund: Genau diese Kombination nutzt die oben angebotene Voreinstellung „Neon-Effekt“.

Keine Daten verlassen Ihr Gerät: Berechnung und Vorschau werden vollständig lokal von Ihrem Browser erzeugt.