So far I have made aliens, ghouls, and skulls with CSS. What else could I make for Halloween? How about a Jack O'Lantern?

I started by changing the background color to orange to match a pumpkin.

.minifig_face {
    height: 100%;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    background: #ff9800; 
    flex-direction: column;
    border: 4px solid black;
}

Next I changed the size of the eyes. I made them longer and oval shaped. I changed the border style from solid to double to make look carved into the pumpkin shell. Finally I changed the background color to look like the interior of a pumpkin.

Then used the eye shape for the mouth and decided to just drop the nose altogether.

.eyes {
    height: 195px;
    width: 145px;
    background: #FFF8E1;
    border-radius: 100%;
    border: double 4px black;
    margin:-10px 10px 0px 10px;
    display: flex;
    justify-content: center;
    position: relative;
    overflow: hidden;
}

I have a Jack O'Lantern. But quickly changing the colors and removing the pupils and border from the eyes. gives me a Howling Ghost.

A gallery of other CSS creations.

Skull

Ghoul

Alien

Alien with scales

    background-image: url(fish-net.png), radial-gradient(rgba(255, 204, 0, 0.01), rgb(253, 245, 192)); 

This branched off Cody Pearce's Bender in CSS post.

Have you ever made something cool with CSS? Share it.

-$JarvisScript git push