Search
Items tagged with: texteffects
The fifth is a pure #CSS text effect.
https://codepen.io/thebabydino/pen/XWQQRWG
No text duplication whatsoever, no pseudos, no images save for CSS gradients. Just a single div and a few heavily commented CSS declarations.
Unfortunately broken in Firefox due to an old bug 🪲 https://bugzilla.mozilla.org/show_bug.cgi?id=1481498
#cssGradient #cssPattern #textEffect #textEffects #code #coding #frontend #web #dev #webDev #webDevelopment #blue
1481498 - background-clip with multiple values fails when one value is text
NEW (nobody) in Core - Web Painting. Last updated 2024-05-06.bugzilla.mozilla.org
The sixth is a little pure #CSS #3D thing I quickly make in under 10 minutes https://codepen.io/thebabydino/pen/wvbWYyd
I really didn't expect anyone would even notice such a silly simple little thing and then it got hearted over 200 times...
#code #coding #fronten #textEffect #web #dev #webDevelopment #webDev #textEffects
The eighth is this no text duplication blended layers demo https://codepen.io/thebabydino/pen/abxLyxw
Uses #CSS gradients and some #SVG #filter magic 🪄 to get the effect - can you figure out how before checking it out on @codepen?
#svgFilter #textEffect #textEffects #coding #code #frontend #web #dev #webDev #webDevelopment
The first one is this text effect that uses absolutely no images whatsoever save for #CSS gradients.
Some #SVG filter magic 🪄 is responsible for the background texture and also for the 3D look of the text and its grainy gradients.
https://codepen.io/thebabydino/pen/gONbppb
#filter #svgFilter #texture #textEffect #textEffects #noise #cssGradient #code #coding #3D #3dText #frontend #web #dev #webDev #webDevelopment