text-shadow: 0px 0px 7px #4466eeff, 0px 0px 14px #4466eee6, 0px 0px 28px #4466eeb3;De CSS Text Shadow Generator is een visuele editor voor de eigenschap CSS Text-Shadow. Je past de horizontale offset, verticale offset, vervagingsstraal, kleur en dekking aan met schuifregelaars en bekijkt het effect live op voorbeeldtekst en kopieert vervolgens de exacte CSS. In plaats van pixelwaarden te raden en uw pagina te vernieuwen, vorm u de schaduw direct en leest u de code die het produceert.
De eigenschap Text-Shadow is eenvoudiger dan box-shadow - het heeft geen spreidingsstraal en geen inzet-zoekwoord - maar gelaagdheid is waar het krachtig wordt. Een enkele declaratie kan meerdere schaduwen stapelen, elk met zijn eigen offsets, onscherpte en kleur. Lagen stapelen is hoe je neongloed, harde contouren, retro 3D-letters, boekdruk-emboss-effecten en lange platte schaduwen bouwt. Het schrijven van die met de hand is lastig, dus deze tool beheert de lagen en voert een spec-valid, door komma's gescheiden declaratie uit in de juiste verfvolgorde.
Alles gebeurt in uw browser. Kies een voorinstelling zoals neongloed of omtrek, stem elke laag af, wissel de preview tussen lichte en donkere achtergronden, bewerk de voorbeeldtekst en kopieer de CSS. Geen account, geen uploads en het blijft offline werken zodra de pagina is geladen.
Kies een voorinstelling zoals Soft, Neon Glow, Retro 3D of Contour om een realistisch startpunt te krijgen, of begin met een enkele standaard schaduwlaag en bouw vanaf daar op.
Sleep de horizontale en verticale offset en vervaag straalschuifregelaars en stel vervolgens de schaduwkleur en dekking in. Bekijk de voorbeeldtekstupdate onmiddellijk terwijl u bewerkt.
Voeg extra lagen toe om gloed, omtrek of 3D-diepte te creëren - verschillende offset-kopieën van een schaduw die wordt gelezen als geëxtrudeerde tekst, terwijl gestapelde wazige kopieën als een gloed worden gelezen.
Kopieer de tekst-schaduwverklaring en plak deze rechtstreeks in uw stylesheet of componentstijlen. Pas het toe op een tekstelement om hetzelfde effect te krijgen.
Stapel een willekeurig aantal schaduwlagen in één declaratie, in de juiste lakvolgorde van boven naar beneden, zo wordt neon gloeiend, omtrekt en 3D-tekst wordt gebouwd
Schuifregelaars voor horizontale en verticale offset- en onscherptestraal, plus een kleurenkiezer en een dekkingscontrole, bedekken elk deel van de tekstschaduwgrammatica
Voorbeeldtekstupdates worden direct tijdens het bewerken en u kunt de achtergrond tussen licht en donker wisselen om te controleren hoe het effect in beide thema's leest
Samengestelde recepten voor zachte, harde neon-gloed, retro 3D, omtrek, emboss, vuur en langschaduweffecten geven je een bewezen startpunt in plaats van een leeg canvas
Design layered CSS box-shadows with a live preview and sliders for offset, blur, spread, color, opacity, and inset — then copy production-ready CSS.
Create beautiful CSS gradients with live preview
Pick colors and convert between HEX, RGB, and HSL formats
0 comments
No comments yet. Be the first to share your thoughts!