It's the first Monday of a new month, so that means it's time for a new #CodePenChallenge!

Last week, the CodePen community wound down September's HTTP Status challenge with style. Check out our HTTP Status 408 collection to see the Pens from the challenge!

October's Theme: Halloween 🎃

Let's dedicate this entire month to the spookiest (and most fun) of all holidays: All Hallows' Eve! Each week's prompt will be a classic Halloween concept, but of course you can interpret it however you wish. There are lots of ways to skin a cat. Gross.

October's Challenge Sponsor:

WordPress powers 31% of the internet. Create a site for yourself with a custom domain name and 24/7 live support. Start writing, sharing, selling, and building your audience today.

Week One Theme: Ghosts 👻

We’re kicking off this month of frights and delights with ghosts! Let’s get scared silly with some front-end fiends 👻. What would you say your average ghost is... opacity: 0.2? 0.1? It's up to you really. Maybe even filter: blur(3px);. Or you might keep it metaphorical. Buttons that only have outlines and show the background behind them are often called ghost buttons these days. It's entirely up to you how you want to interpret the challenge!

Your Challenge

Create a Pen inspired by ghosts. Go for a practical design, or go full-on painterly poltergeist! It’s up to you.

How to Participate

Create a Pen and tag it codepenchallenge and the weekly tag cpc-ghosts. 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. Take this opportunity to polish your CSS illustration skills to create a creepy (or cute) ghost.
  2. Show off your idea for the perfect "ghost button" design
  3. David Ojeda shares a technique for spotting "ghost" elements in HTML. Could you put a Halloween spin on it?


  1. Suzanne Scacca on the pros and cons of the “ghost button” in Smashing Magazine
  2. The CodePen community loves a good scare! Check out some of the most popular ghost Pens.
  3. You can't beat a good ghost story. Wouldn't one of these public-domain tales be fun to typeset?