Text Components
Animated text components with stunning effects built with TailwindCSS and Framer Motion.
Scramble Hover
Text component that animates by scrambling its letters on hover, then resolves to the original text. Useful for headings, buttons, and interactive UI.
Typewriter Text
Animates text as if being typed out, letter by letter. Supports custom speed and looping.
Wave Text
Animates each letter in a wave pattern using Framer Motion.
Reveal Text
Reveals text with a fade or slide-in effect, optionally triggered on scroll into view.
Scroll Reveal Paragraph
A paragraph component that reveals words progressively as the user scrolls, creating a smooth text reveal animation effect.
LoremLoremipsumipsumdolordolorsitsitamet,amet,consecteturconsecteturadipiscingadipiscingelit.elit.SedSeddodoeiusmodeiusmodtemportemporincididuntincididuntututlaborelaboreetetdoloredoloremagnamagnaaliqua.aliqua.UtUtenimenimadadminimminimveniam,veniam,quisquisnostrudnostrudexercitationexercitationullamcoullamcolaborislaborisnisinisiututaliquipaliquipexexeaeacommodocommodoconsequat.consequat.DuisDuisauteauteirureiruredolordolorininreprehenderitreprehenderitininvoluptatevoluptatevelitvelitesseessecillumcillumdoloredoloreeueufugiatfugiatnullanullapariatur.pariatur.ExcepteurExcepteursintsintoccaecatoccaecatcupidatatcupidatatnonnonproident,proident,suntsuntininculpaculpaquiquiofficiaofficiadeseruntdeseruntmollitmollitanimanimididestestlaborum.laborum.SedSedututperspiciatisperspiciatisundeundeomnisomnisisteistenatusnatuserrorerrorsitsitvoluptatemvoluptatemaccusantiumaccusantiumdoloremquedoloremquelaudantium,laudantium,totamtotamremremaperiam,aperiam,eaqueeaqueipsaipsaquaequaeababilloilloinventoreinventoreveritatisveritatisetetquasiquasiarchitectoarchitectobeataebeataevitaevitaedictadictasuntsuntexplicabo.explicabo.NemoNemoenimenimipsamipsamvoluptatemvoluptatemquiaquiavoluptasvoluptassitsitaspernaturaspernaturautautoditoditautautfugit,fugit,sedsedquiaquiaconsequunturconsequunturmagnimagnidoloresdoloreseoseosquiquirationerationevoluptatemvoluptatemsequisequinesciunt.nesciunt.
Looking for more?
Explore our other component groups for more UI elements.