
See the Pen Harry Potter Puppet Pals:Bother by Christina Gorton Deathly Hallows by Joshua Wardįrom the last book in the series, the Deathly Hallows are three powerful magical objects – symbolized here via CSS. Powered by SVG and GSAP, the snippet sports a wonderful childlike quality.

What are they doing? Bothering Professor Snape, of course. Here we have a colorful animation that envisions Harry and his pal Ron Weasley as puppets.

See the Pen Harry Potter by Christina Stephan Harry Potter Puppet Pals:Bother by Christina Gorton Even better is that the entire snippet is responsive, so you can watch him fly by on any sized screen. Who’s up for a game of Quidditch? This fun animation features Harry on his broom, chasing that elusive Golden Snitch. See the Pen Single div Harry Potter character icons by Alvaro Montoro Harry Potter by Christina Stephan CSS Grid is used to create the spot-on layout. Here we have characters representing the various Hogwarts houses – including Harry and Draco Malfoy. It takes a lot of creativity to make something as unique as these character icons in one simple container.

When you think about it, there’s a special kind of magic to a single-div snippet. See the Pen CSS Animation:Marauder’s Map by Olivia Ng Single div Harry Potter character icons by Alvaro Montoro And this being such a magical place, you can even use your device’s microphone to open the map. More than just static text and images, this Marauder’s Map also tracks the movements of Harry and Professor Snape. The term “living document” has an entirely different meaning in the wizarding world. So, ready your wands and prepare for a journey into Hogwarts!ĬSS Animation:Marauder’s Map by Olivia Ng Today, we’ll show you 8 of the most spell-binding code snippets. Everything from character art to complex animations is being showcased. Some are all-too-happy to pay homage to their favorite characters and scenes with a touch of CSS and JavaScript magic. Therefore, it’s no wonder that this wizarding world has captured the imaginations of web developers as well.

Not to mention a massive line of collectibles and amusement attractions. The ensuing movies grossed billions of dollars. The books have been translated into dozens of languages. What started as a series of novels quickly turned into a global phenomenon. Few pop culture icons can match the sheer reach of Harry Potter.
