Text Shadow Generator
Erzeugt einen fertigen CSS text-shadow aus deinen Werten.
Dieses Tool ist für Mitglieder
Dieses Premium-Tool schaltest du mit einem kostenlosen Konto frei — zusammen mit allen anderen Profi-Tools und den ganzen Wissen-Artikeln.
100 % kostenlos · keine Kreditkarte · sofort freigeschaltet
Wozu dient der Text Shadow Generator?
Der Text Shadow Generator erstellt fertigen CSS-Code für Textschatten. Praktisch für Webdesigner, die Überschriften plastischer machen, Text vor Hintergrundbildern lesbarer gestalten oder einen Neon- beziehungsweise Outline-Effekt erzielen wollen.
Du stellst X- und Y-Versatz, das Weichzeichnen und die Deckkraft des Schattens ein. Der Generator gibt dir die fertige text-shadow-Eigenschaft zum Kopieren aus. Alle Werte lassen sich frei kombinieren. Die Berechnung erfolgt vollständig in deinem Browser.
Beispiele
- Versatz 1/1 px, Blur 2 px, Deckkraft 30 %: text-shadow: 1px 1px 2px rgba(0,0,0,0.3), ein dezenter Lesbarkeitsschatten.
- Versatz 0/0 px, Blur 8 px, Deckkraft 80 %: ein leuchtender Glow-Effekt für eine farbige Überschrift.
- Versatz 2/2 px, Blur 0 px, Deckkraft 100 %: ein harter, versetzter 3D-Effekt.
Häufige Fragen zum Text Shadow Generator
Wie mache ich Text auf einem Foto lesbar?
Ein leichter dunkler Schatten mit geringem Versatz und etwas Blur hebt hellen Text vom Hintergrund ab. Werte wie 1px 1px 3px mit mittlerer Deckkraft funktionieren gut.
Kann ich mehrere Textschatten kombinieren?
Ja, in CSS lassen sich mehrere durch Komma getrennte text-shadow-Werte angeben. Damit erzeugst du etwa einen Outline- oder mehrfarbigen Neon-Effekt.
Worin unterscheidet sich text-shadow von box-shadow?
text-shadow legt den Schatten direkt unter die Buchstaben, box-shadow unter das gesamte Element. Für Schrift ist text-shadow die richtige Wahl.
Werden meine Eingaben gespeichert?
Nein. Alle Berechnungen laufen ausschließlich im Browser. Es werden keine Daten gesendet oder gespeichert.
Ist das Tool kostenlos?
Ja, vollständig kostenlos und ohne Registrierung.