Letter Effects and Interaction Ideas
Category: animation, effect, hover, Playground, typography
Today we’d like to share four typography animations with you. Letters are such a great thing to play with and they allow for so many interesting interactions and effects to enhance a design and make decorative headlines stand out. For some animations we use anime.js. Charming.js helps us with the needed structure for the letters.
Attention: We use some modern CSS properties like CSS Grid and CSS Variables in the demos, so please view them with a capable browser.
Please note that some of the effects are specifically made for hover so mobile support is limited.
Here are the previews of the demos:
We hope you have fun with these little effects and find them inspiring!
References and Credits
- anime.js by Julian Garnier
- Charming.js by Yuan Qing
- imagesLoaded by Dave DeSandro
- “Kidnap” letters created with Ransomizer
- Death icon by Freepik
Letter Effects and Interaction Ideas was written by Mary Lou and published on Codrops.
LEAVE A REPLY
You must be logged in to post a comment.