Check out my courses and become more creative!
https://developedbyed.com
Today we are going to create an SVG animation using stroke dash array and stroke dash offset to create some really cool effects.
We only need HTML and CSS for this effect. You can create the shapes and texts with Figma, Adobe XD or Adobe Illustrator.
Let me know if you want to see more complex SVG animations with tools like bodymoving/lottie.
Try to get creative and apply the path animations to different kinds of texts, shapes,etc.
Microphones I Use
Audio-Technica AT2020 – https://geni.us/Re78 (Amazon)
Deity V-Mic D3 Pro – https://geni.us/y0HjQbz (Amazon)
BEHRINGER Audio Interface – https://geni.us/AcbCpd9 (Amazon)
Camera Gear
Fujifilm X-T3 – https://geni.us/7IM1 (Amazon)
Fujinon XF18-55mmF2.8-4 – https://geni.us/sztaN (Amazon)
PC Specs
Kingston SQ500S37/480G 480GB – https://geni.us/s7HWm (Amazon)
Gigabyte GeForce RTX 2070 – https://geni.us/uRw71gN (Amazon)
AMD Ryzen 7 2700X – https://geni.us/NaBSC (Amazon)
Corsair Vengeance LPX 16GB – https://geni.us/JDqK1KK (Amazon)
ASRock B450M PRO4 – https://geni.us/YAtI (Amazon)
DeepCool ATX Mid Tower – https://geni.us/U8xJY (Amazon)
Dell Ultrasharp U2718Q 27-Inch 4K – https://geni.us/kXHE (Amazon)
Dell Ultra Sharp LED-Lit Monitor 25 2k – https://geni.us/bilekX (Amazon)
Logitech G305 – https://geni.us/PIjyn (Amazon)
Logitech MX Keys Advanced – https://geni.us/YBsCVX0 (Amazon)
DISCLAIMERS:
I am a participant in the Amazon Services LLC Associates Program, an affiliate advertising program designed to provide a means for us to earn fees by linking to Amazon.com and affiliated sites.
-~-~~-~~~-~~-~-
Follow my Twitter:
https://twitter.com/DevEd94
Please watch: “Should You Become A Software Engineer?”
-~-~~-~~~-~~-~-
source