Category Image 052
Posted on by Chris Coyier

395: The Most Hearted of 2022

Marie and I hop on the show to discuss our recently released Most Hearted of 2022 Pens. We only did the calculations the day before, so this is more of a first reaction than a deep dive.

  • Congrats to Hyperplexed for #1 and a massive year on CodePen. Last year, just one entry on the Top 100, and this year, nine. “Full layouts” like this appeared a number of times, including Aysenur Turk, last year’s winner, at #13 with Liquid Transition Effect, and there were two NFT-themed landing pages (1, 2) in the Top 100.
  • A lot of Pens attract attention when they have that “I could use this” feel to them, demonstrated by Ryan Mulligan’s Logo Wall at #2!
  • High five to Greensock for taking #3 with a re-creation of Brian Cross’ lovely Pen. The tag “gsap” was used a ton in the Top 100.
  • Jon Kantner took #4 and 10 other spots making this the most appearances on the Top 100 list ever, and also took a spot with a Pen made on December 13th! Aaron Iker and Yoav Kadosh both had 4 spots.
  • Perhaps my favorite because of the deep CSS trickery involved was Scott Kellum’s Apple inspired pride clock. Scott has the oldest account of anyone in the list, over 10 years old! Huge fan of Steve Gardener’s joke, though as well.
  • 11 of the Top 100 were created for CodePen Challenges.

Time Jumps

  • 00:23 The rules of the game
  • 05:13 Grinch style hearting reminder
  • 06:34 Number one on the list
  • 10:24 Sponsor: Notion
  • 11:12 Logo wall
  • 12:52 Greensock scrolling site pen
  • 14:40 NFT landing pages
  • 16:25 11 appearances by John
  • 17:30 Shaw made the list
  • 19:09 Challenge pens made the list
  • 22:16 New CodePen members on the list
  • 23:25 Longest CodePen member on the list
  • 25:09 Elements that are popular
  • 27:44 Spider pens
  • 29:37 Snowball pen

Sponsor: Notion

Notion is an amazing collaborative tool that not only helps organize your company’s information but helps with project management as well. We know that all too well here at CodePen, as we use Notion for countless business tasks. Learn more and get started for free at notion.com. Take your first step toward an organized, happier team, today.