Recreating Apple's security/privacy padlock animation on the logo through just code
So I was redesigning a startup's website with better UI and animations to show my skills and then to pitch for an internship opportunity using that as proof of work. Now they have this section on security/privacy where I thought it would be cool to make an Apple privacy-type padlock animation with their logo. So my question is, can be done using CSS or any framework with just code and not animation software?(EDIT: I will be using an image of the logo and code the handle of the lock, as otherwise it would be too difficult)
8 Replies
you can build it in svg (for example in figma) and animate the invidivual parts with css
what if I use the logo of the company as a picture file and just code out the handle of the lock? Recreating the logo in code is not worth the effort in my opinion.
i had a little time, here an svg
the svg has 3 parts (lock, leaf and apple), all accessible by id in css. Which you can animate
Bro this is amazing!!! Thanks a lot for taking out time to help me. I'll let you know after I try and figure this out
no problem, good luck
hey its done. thanks...