CSS Tekst- Schaduw Generator
Maak multi-laag tekstschaduw-effecten visueel met live voorbeeld.
① Pas offset en blur per laag aan ② Voeg meerdere schaduwlagen toe ③ Kopieer de CSS
Voorinstellingen:
Schaduw 1
2px
2px
4px
30%
CSS-code
text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.3);
Wat is CSS text-shadow?
De CSS-eigenschap text-shadow voegt een of meer schaduwen toe aan tekst. Elke schaduw wordt gedefinieerd door X-offset, Y-offset, blur-straal en kleur — bijv. text-shadow: 2px 2px 4px rgba(0,0,0,0.5). Meerdere lagen worden door komma's gescheiden voor complexe effecten zoals glow en neon.
Veelgestelde Vragen
CSS text-shadow voegt schaduweffecten toe aan tekst. Elke schaduw vereist X-offset, Y-offset, blur-straal en kleur. Meerdere kommagescheiden schaduwen creëren complexe laageffecten.
Ja. CSS text-shadow accepteert een kommagescheiden lijst van schaduwdefinities. Elke schaduw wordt in volgorde toegepast, met de eerste bovenaan.
De blur-straal bepaalt hoe verspreid de schaduw is. Een waarde van 0 geeft een scherpe schaduw. Grotere waarden creëren zachtere schaduwen.
Gebruik vier schaduwen met blur 0, elk verschoven in één richting: text-shadow: 1px 0 black, -1px 0 black, 0 1px black, 0 -1px black.
Stapel meerdere schaduwen met toenemende X- en Y-offsets in dezelfde kleur: text-shadow: 1px 1px #aaa, 2px 2px #aaa, 3px 3px #aaa.
Text-shadow is GPU-versneld in moderne browsers. Grote blur-stralen op zeer lange tekst kunnen de prestaties op low-end apparaten beïnvloeden.
CSS text-shadow wordt ondersteund door alle moderne browsers sinds 2010. Geen vendor-prefixen vereist.