5 Resources for Inspiration to Create Pure CSS Images

Michael Mangialardi
Coding Artist
Published in
3 min readJan 25, 2017

What you’re getting into: A very short and readable post with links to 5 resources for inspiration to create pure CSS images.

With the Daily CSS Images challenge continuing to grow and develop, I thought it would be beneficial to write a short and sweet post on how to get inspiration to carry you through.

Additionally, these resources will hopefully have an impact on not just pure CSS images, but all other frontend development.

1. The Imagineering Workout

If you have ever watched a Disney movie, at some point you’ve probably marveled at the creativity that must have been involved in the artwork and storytelling. Turns out, there’s a book from the Disney Imagineers that is meant to be a workout for your creative muscles written by various imaginative minds at Disney.

With this book, you can do an exercise before a challenge, or as periodically as you’d like, and have your creative juices flowing!

2. Dribbble

Dribbble is a community of designers sharing screenshots of their work, process, and projects.

You can search for different images to gather inspiration. More specifically, you are going to want to gather ideas by looking at color choices and layout. When it comes to pure CSS images, try to look at an image and break it down into simple shapes. By getting in the habit of doing this, you will start to see that images that looked complex and confusing can be reproduced by using simple shapes.

3. #dailycssimages Twitter

This may seem obvious if you are doing the challenge, but if you search #dailycssimages on Twitter, you can see what other participants are making which is a great way to gather ideas and inspiration.

4. CSS Peeper

CSS Peeper is a Chrome plugin which allows you to see the CSS styling of any website. Go to websites that have a design you love and see what color scheme they use.

5. Codepen

Codepen is a frontend playground where people are continually making amazing things. Codepen also works as a show and tell for frontend developers.

All of the Daily CSS Images challenge participants use Codepen so you can search to see what everyone is making and their code. Beyond just Daily CSS Images, there are constantly amazing creations on their front page, as well as their newsletter called Spark which can serve as inspiration.

Go ahead and check out these awesome sources of inspiration and make sure to join the Daily CSS Images challenge if you haven’t already!

Feel free to add your sources of inspiration in the comments.

Cheers,
Mike Mangialardi

--

--