cssAudio - Activefile-genericCSS - ActiveGeneric - ActiveHTML - ActiveImage - ActiveJS - ActiveSVG - ActiveText - Activefile-genericVideo - ActiveLovehtmlicon-new-collectionicon-personicon-teamlog-outoctocatpop-outspinnerstartv headernumbered-list123split-screen
CodePen probably won't work great in this browser. We generally only support the major desktop browsers like Chrome, Firefox, Safari, and Edge. Use this one at your own risk! If you're looking to test things, try looking at Pens/Projects in Debug View.
user profile image

Comments

  1. This is incredible.

  2. Incredible!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!

  3. This is insanely cool and impressive! I bet it takes forever to get all the movements and timing just right, but I bet it's like a sort of meditation.

  4. so cool!!!!

  5. Stunning. Wonderful work!!!

  6. Incredible art!

  7. this is amazing!

  8. Such wonderful work.

  9. AMAZING!!!!!!

    it's the most incredible css animation I ever seen!

  10. Мать, это просто огнище)

  11. That's so cool! What a detailing.. superb work.

  12. ❤️❤️❤️

  13. That's wonderful. Those details...

  14. I'm shocked... this is simply brilliant! One of the most incredible things ever! I'm amazed... congratulations!

  15. Very cool, and lots of work too!

  16. Damn you're good.

  17. Wow! Do you use some kind of tool to keep track of the timing and various elements, layers etc.? Or do you do it by hand? As the timing is incredible.

  18. @pmk I just look at original gif and try to repeat it in code. All by my hands :)

  19. @miocene That is awesome. I always struggle to get the various parts of animations to line up. Even if I use SASS for calculating durations and delays. And I thought my latest animation with 11 keyframe sequences https://codepen.io/pmk/pen/vadYVK was advanced. LOL :D

  20. this is cool! A lot of work, but it was worth it! =)

  21. Looks great :) and a lot of work here !

  22. What a remarkable Art. awesome

  23. Great work, a real showcase for what can be achieved with CSS transforms :-)

    The z-index of the arms might be increased to put it in front of the cape and creatures created, for some movements the arms are cut off a bit

  24. That's SO impressive! How long did you took to finish this? :D

  25. As everybody mentioned, this is an absolutely amazing design and implementation. May I ask how many hours you spent on this?

  26. @ericgruby @aminakhtar @IOU I did it about a month, but not every day and even not every week :)

  27. This is incredible! I would love to see a full fledged game designed and coded in this style. Well done!

  28. Your patience is amazing! And the fact that the browser runs all of it... how did you pull that off?

  29. Love it, this is such an amazing use of CSS

  30. Wow Amazing. Can you share for me a little experiences to do like that. I really want to make something like that with just pure CSS

  31. really =????

  32. The detail on this is just outstanding! wow

  33. Wow! Truly fantastic! This is well above my skill level, and I thank you for sharing!

  34. @blackzero many people today ask me for this. I think I should write some big post about process to share my experience with all of you :)

  35. Bravo!!! You deserve an accolade....

  36. You are a true superhuman lol

  37. I could never do this

  38. What. The. Fuck. No one should be this good at CSS. Get some help :)

  39. this is the best css art I have ever seen in my life. I LOVE THIS

  40. Incredible Art Work Outstanding! WoooooooooW ----------------------------------------

  41. No words Julia, it's such a wonderful creation... Can't say anything.. feeling speechless. This one should be an inspiration to all CSS ninjas. Lots of love <3

  42. That's impressive ! Are you Chronos ? Because you must be a timing god to manage those keyframes

  43. how long did this took you??

  44. ‪Oh wow!! The level of detail in this is absolutely incredible! 😍😍😍😍😍‬

    I would LOVE to see how this was made. What tools did you use? Following for sure! 😱😱😱

  45. awseome craft..

  46. This is insane.You have done such a great job and definitely have inspired me to work hard to be able to do what you remarkably do.Cheers!

  47. Saw this and just clicked follow. The amount of patience, time and effort put into this is what amazes me the most! How long did it take to make this?

  48. Very nice :)

  49. You are a creative genius. Words fail to express how this pen makes me feel. Astonishing work, Julia!

  50. 牛逼o( ̄▽ ̄)d

  51. This is AMAZING!

  52. Absolutely amazing. WOW!

  53. Невероятно круто)

  54. This is definitely magical!

  55. This is sorcery! What was your process for previewing your animation past the first 4-5 seconds? Did you need to wait for the entire pen to play through each time? Were you able to create certain elements separately and then bring them together for this pen?

    Seriously awesome!

  56. @mdixondesigns thank you 😊

    I do every object separately and navigate through it’s animation by Chrome animation dev tool. But yes, I always watch full animation before I can navigate. It’s ok, if you do something else at this time. Like drink coffee or watching serials 😄

  57. WOW !! THIS IS INCREDIBLE !! I'm a UI designer and know nothing about code, just want to learn HTML5 and CSS. You make me more interested to learn CSS. YOU ARE JUST SO COOL !

  58. Wow !! This is a masterpiece.

  59. This is so cool. I can only imagine how much time you put into it -- whatever it was, it was well worth it! I wish I could download a GIF version of this.

  60. Breathtaking. I'm really impressed with your work!

  61. i cant imagin it .it's art work.

Leave a Comment Markdown supported. Click @usernames to add to comment.

You must be logged in to comment.
Loading...
Loading...