37 Halloween Frontends🦇
Tags: halloween, webdev, css, html
Published: 2020-10-20 18:06:16


🎃 Allow for some load time 🎃 

What's not to love with Halloween?
It is the candy corn of my sunken eye sockets! 

So this October, I set out to find the spookiest designs.

_<sub>Note: All works link to the creators for attribution and alternative text provided. Also if anyone knows of any Ghost Buster or Beetlejuice design themes, please share. I'm literally dying to see this...</sub>_ 


{% codepen https://codepen.io/terabaud/pen/MWeYvPv  %}

[![halloween orange pumpkin rabbit mutation floating mid-air for Hulu design](
https://cdn.dribbble.com/users/3964490/screenshots/13406697/media/84780f24a917d27dfbb9f716fffc6c97.jpg)](https://dribbble.com/shots/13406697-Hulu-movie-genre-render-horror)

{% codepen https://codepen.io/issey/pen/qazVwX %}


[![image of super creepy pixel box dotted images of super creepy bad guys from movies in bright neon colors!](https://cdn.dribbble.com/users/4666603/screenshots/14398345/media/8937a334f873725a8e17292e5f941b42.gif)](https://dribbble.com/shots/14398345-Halloween-Party)





[![image of vintage retro design of spooky skeletons and pumpkin art deco collage](https://cdn.dribbble.com/users/3774189/screenshots/14201381/media/0d2a2b16903829a46b7ce8a26f7932bc.jpg)](https://dribbble.com/shots/14201381-Antique-Halloween-Toys)

[![image of girl glitching like a tv glitch with pigtails and platinum hair and blood on lip](https://codemyui.com/wp-content/uploads/2017/08/glitch-effect.gif)](https://codemyui.com/horror-movie-like-glitch-effect/) 

{% codepen https://codepen.io/hammercait/pen/RwaVyEj  %}

{% codepen https://codepen.io/gcyrillo/pen/RMzPjo  %}



[![candy skull frontend interface](
https://cdn.dribbble.com/users/787324/screenshots/14389372/media/db7ce8fd0a10271fdd8d57ccf415db5d.png)](https://dribbble.com/shots/14389372-Ghost-Agency-Free-Halloween-Kit-Figma-Community)

{% codepen https://codepen.io/eleana-tyradelli/pen/JjKoPqG  %}

{% codepen  https://codepen.io/Lima_Hammoud_/pen/RwwjJyL   %}



{% codepen https://codepen.io/takaneichinose/pen/qzQMZy  %}

[![image of super kawaii smooth illustration of a pink teddy bear with candies in bright pastel colors!](
https://cdn.dribbble.com/users/3923578/screenshots/14302574/media/c0d79f0b1faf9893286ef1e2a363c749.jpg)](https://dribbble.com/shots/14302574-BOO)

{% codepen https://codepen.io/ya_lops/pen/GvobzX  %}

{% youtube TBXjWsR7XDA %}

[![image from tv show stylized in 80s horror theme, campy! Bright neons with a woman and a knife on the head](
https://cdn.dribbble.com/users/1497352/screenshots/7824372/media/4326eb90c062fff8e4dba8808dc28364.jpg)](https://dribbble.com/shots/7824372-Camp-Redwood-American-Horror-Story-84)




{% codepen https://codepen.io/ablissfullemon/pen/zJepap  %}


{% codepen https://codepen.io/vuild/pen/BvWLvB  %}


[![ihaunting movie film imagery of Carrie, Conjuring, darker style, black background](
https://cdn.dribbble.com/users/97158/screenshots/7374897/media/28eee757aa67bbcd099ce89c583fcab3.gif)](https://dribbble.com/shots/7374897-Horror-UI)

{% codepen https://codepen.io/ge1doot/pen/xrBryP  %}

{% codepen https://codepen.io/slyka85/pen/gQMzdJ  %}


[![Interesting light design landing page where an animation of a cornucopia of spooky objects and shapes pop up in tiers on the screen with a ghost its all lighter colors which makes it pretty unique looking for being so spooky](
https://cdn.dribbble.com/users/2090940/screenshots/5465663/halloween_pascal_4.gif)](https://dribbble.com/shots/5465663-Spooky-Island)


[![image of spooky graphical dashboard in purple and orange](https://cdn.dribbble.com/users/1788428/screenshots/14415829/media/6e701868ff2f787906591f91b7ded813.png)](https://dribbble.com/shots/14415829-Spooky-dashboard)


[![slimey pumpkin frontend interface examples](
https://cdn.dribbble.com/users/2104999/screenshots/9306190/media/cb9a86d43985589d767f98e8ba2684c8.png)](https://dribbble.com/shots/9306190-Halloween-landing-page)



[![Creepy kid face landing page for 404 errors in blue and orange with the middle of his face split open and a white skull showing graphically not realistically but very spooky](
https://cdn.dribbble.com/users/136820/screenshots/8003797/media/76c6fc93415324bbd9bc8719f048260f.png)](https://dribbble.com/shots/8003797-tError404)


[![genuine looking haunted house in a 3D view very smooth surfaces and with the roof caved in like ghosts got into it, with a spooky vibe of fog and dark lighting!](
https://cdn.dribbble.com/users/269899/screenshots/7901786/media/d3e1631d457a7f0d6b3e8b653b7ec466.png)](https://dribbble.com/shots/7901786-Haunted-House-Dribbble-Weekly-Warm-Up)




{% codepen https://codepen.io/Shreyansdongare/pen/jOrrNyN  %}

[![happy halloween pumpkin modal card in orange with skull pattern behind modal](
https://cdn.dribbble.com/users/1632586/screenshots/8335194/media/5fb121232dc072495089f233900a4d8e.jpg)](https://dribbble.com/shots/8335194-Halloween-Landing-Page)


{% codepen https://codepen.io/isuttell/pen/raxRaJ  %}


{% codepen https://codepen.io/colinmyers1/pen/oNLbGxd  %}










{% codepen https://codepen.io/3Shan3/pen/yLOwBYM  %}




[![happy halloween haunted 3D house with birds eye view and green lighting the windows eerily](https://cdn.dribbble.com/users/15687/screenshots/14371464/media/699436f595b1f63bf6dbac2ed71434b2.png)](https://dribbble.com/shots/14371464-Haunted-House)

{% codepen https://codepen.io/supah/pen/yRYveX  %}

{% codepen https://codepen.io/jkantner/pen/ErQNQW  %}

[![cartoonish encounter of trick or treaters on a dark red night going to a super duper haunted house at night and encountering a nefarious creature of the night with the frontend text of Trick or Treat](https://cdn.dribbble.com/users/2323842/screenshots/5470774/dribbble_halloween_kikis_6.gif)](https://dribbble.com/shots/5470774-Knock-Knock-Trick-or-Treat)





Hope you enjoyed the horrorful compilation of super terror!

**Ghoul's Note:** My name is Julia Nash, I am an Offering Manager for the Center of Open Source Data & Artificial Intelligence Technologies, which may or may not specialize in Open Source Paranormal Data & Artificial Zombie (and Goblin) Intelligence.

### [**_CHECK US OUT, IF YOU DARE..._**] (https://www.ibm.com/opensource/centers/codait/projects/) 🧟‍♀️