New week, new #CodePenChallenge!

Last week, the CodePen community celebrated the panda — both the black & white giant and its little buddy the red panda. Check out the Pens from the challenge in our Pandas collection.

Week Three Theme: Tigers 🐅

We’ve delved into the ocean and roamed bamboo forests this month, and now we’re ready to visit the jungle! This week’s prompt is the mighty tiger 🐅

November’s Challenge Sponsor: CodePen Jobs

The CodePen Jobs board is the place to find the right front-end developers and designers for your company, or get your next gig! Post a new job listing or browse positions at

Your Challenge

Create a Pen inspired by tigers. Illustrate them, tell us their stories, or borrow their stripes for a striking table design!

How to Participate

Create a Pen and tag it codepenchallenge and the weekly tag cpc-tigers. We’ll gather those Pens into a collection and share our favorites on Twitter and Instagram (Use the #CodePenChallenge tag on Twitter and Instagram as well).


  1. Illustrate or animate tigers with CSS, SVG, or JS.
  2. Literature is full of famous tigers, from William Blake’s “Tyger” to Pi’s boating companion Richard Parker. Could you adapt the story of your favorite fictional tiger for the front-end?
  3. We’ve all seen the CSS zebra striped table. How about a striped table with a tiger-inspired color palette?


  1. The CodePen community has lots of wonderful tiger illustrations! Check out Mike Mangialardi’s SVG Bengal for a realistic approach, or Sasha Tran’s “Tiger Reading a Newspaper” for something a little more fanciful!
  2. Taking the storytelling approach? Check out how to create a page-turning effect with turn.js in Anya Melnyk’s Pen “Book Flip Page Turn”.
  3. Draw inspiration for your table stripes from this tiger-themed color palette at Schemecolor.