When I need to come up with a new email design or just couple ideas for a client, I usually follow the below checklist:
- Try to understand the existing corporate identity / brand style of the client.
- Check out email designs of their top competitors.
- Clarify the goal(s) of the email template.
- Come up with the email copy, since I believe that the design itself needs to support the copy, not the other way around.
- Look for email design inspiration online.
- Come up with a basic layout which I create with our email builder right away. No wireframing in Photoshop or similar. I go straight to the editor.
- I check out my favorite (email) design resource sites and try to come up with one or two initial versions.
In this article I'm going to share with you of our favorite email design resources that my colleagues and I use to create our very own Chamaileon template library.
We have over 200 predesigned email templates in our software. Bad news: the software is still under development, good news: you can become part of the early users, who get free access once it's launched. Want in?
I hope this collection will help you to come up with stunningly beautiful email designs :)
This article is part of a longer series which helps email marketers to understand the ins-and-outs of email design. Here you can see the complete list of articles we have. You might want to check out and read some of them.
Deciding on the color scheme of your next email can be frustrating, and may require some extra help. The following resources include several helpful sites to explore and find inspiring color palettes, or to generate something brand new from an existing image that you already have in mind.
- Paletton is a custom color palette generator that features its' own interactive color wheel. Some of your choices include a monochromatic, triad, or tetrad color palette that you can create using the color wheel. There are plenty of preset color palettes to use too. For those interested in color theory and color psychology, Paletton also has their own Colorpedia as a reference.
- Pictaculous generates a color palette based on any image of your choice. Simply upload your image to the website and you'll receive several color palette suggestions from Pictaculous, as well as two other web applications: Adobe's Kuler and COLOURLovers. Choose the palette you like the most!
- COLOURLovers is a collection of many helpful email design resources. This creative community is there to help you when you're in need of color inspiration, whether it's colors, shapes, patterns, or a color palette. Find seamless patterns and even customize the colors of the pattern with some of your own color creations straight on their website. Create an account to follow your favorite designers for plenty of design inspiration.
- Color Hunter is another custom color palette generator. Search for images by tag, upload your own image, or search by hex code to find a previously uploaded image to use in your next email template.
Searching "blossom" resulted in the following images:
Free Stock Photos and Illustrations
When looking for the right stock photos for your next email template, it might be necessary to check out many sources to find the right one.
As an email marketer, you must also make sure that any images you choose to use are available under the Creative Commons Zero (CC0) license. This license ensures that the images are completely available to modify, copy, and distribute however you like. No attribution is required to use these photos. For this reason, we included only sites that are licensed under CC0.
Check out the following list for the leading free stock photo sites we recommend.
- Pixabay is the biggest free stock photo search engine. It aggregates photos from many different free sources, which you could visit one by one too. They have almost one million photos in their database.
- Pexels is one of our top go-to spots for awesome stock photos. Search Pexels with any tags of your choice or check out some of their popular searches.
See "office" related stock photos below:
- Unsplash is another great source for thousands of free stock photos. Search by any tag of your choice or check out pre-made collections of photos.
Here is a small selection of some of the collections on Unsplash:
- Place It allows you to put your custom image in a stock photo. Most of the stock photos feature a customizable display on a smartphone, tablet, or desktop. With Place It, you can customize these images with your logo, a screenshot of your services, display of your website, or anything you can think of. Simply drag and drop your image into any of the stock photos on their website.
Only small images and videos are available at no cost to you, and you will have to upgrade your account to download any larger images or videos.
- Comp Fight is an image search engine to help you find exactly what you're looking for. Comp Fight allows you to search through millions of images at your fingertips, using the image hosting site Flickr.
- Kaboom Pics provides you with breathtaking photos for your personal and professional projects. Like the other sites for stock photos, you can search by tag or check out their pre-selected collections.
Here is one of the results from the "Fashion" collection:
- Infogr.am is an ideal resource for those looking to include an interactive chart in their next email copy. With Infogr.am, you can use your own data to create a visually appealing chart or data representation.
Create your own interactive infographics and visualizations by uploading your own data in any chart format of your choice. There are free and paid options, depending on how many visualizations you are trying to create.
In the image below, you can see a few examples of the possible visualizations you can make with Infogr.am:
- Vectr is an online graphics and image editor that is available to use on their website, or by a free download. Each design that you work on can be accessed by its' own unique URL, allowing you to work collaboratively with your team.
There is also a thorough user guide and list of tutorials on Vectr's website, to ensure a low learning curve for Vectr users.
Check out what Vectr looks like below:
Can't seem to find the right font for your next email template, but want something new? Check out our top font resources to find up and coming fonts, as well as useful tools for comparison to help you narrow down your font selection.
Don't forget that custom fonts are not widely supported in email. So you might need to actually overlay the text to your images. In this always make sure that the text on your image remains readable even if viewed on mobile.
- Google Fonts is a free, online font directory with over 800 fonts for you to use in your next email.
- Tiff is a useful resource when you can't decide which font is the best for you to use. Tiff allows you to visually compare two different fonts by placing them side by side, or by overlaying the two fonts. If you're stuck between two fonts, this tool can help you decide which font is the best option for your next email.
In the image below, Georgia and Verdana are represented side by side to compare their differences.
- Pixel Buddha is designed for the professional community in order to provide a huge variety of high quality free and premium design resources. Their passionate team provides new content additions each week, including stock photos, fonts, texture, patterns, and text effects. Check out their freebies section to see if anything catches your eye!
See some of their fonts collection below:
What Font is a chrome extension that can be used to identify specific fonts anywhere on the web. This tool is especially helpful if you find a font you like somewhere on the web, but you aren't exactly sure of its' name or how to find it.
Font Squirrel provides hundreds of stylish fonts to you at no cost. Search through their list of 20+ categories with hundreds of fonts, as seen in the image below, to find the perfect font for your next email.
Free Animated GIFs
What better way to spice up your next email and engage your audience than with an animated GIF! Find the perfect GIF by searching through any of the following search engines.
- GIPHY, an online database and search engine for GIFs, is our go to source when we want to include animated GIFs in our emails. With GIPHY, you can search their website for free GIFs using your own tags or their selected categories. You can even make your own GIF here, using any YouTube or Vimeo video you have in mind.
Seen below are some of GIPHY's featured reaction GIF categories, including "Good Job", "Bye", and "High Five":
- Github can be used to search for GIFs, too! Check out some of the already compiled repositories for GIF storage, simply by searching for GIFs - there's over 5,000 results to explore! One of the top results leads you to a user's GIF storage website, where you can filter your results and hover to preview an image.
Check out some of the categories on his website below:
- GifMe is a unique tool for discovering, sharing and collecting your favorite GIFs. GifMe allows users to save their favorite GIFs from all over the web onto their service, and users can choose how to tag their content. This way, users can quickly refer back to their GIFs at any time. Once saving a GIF to GifMe, it will already have its' own URL to share with your team. You can also search their website, which contains GIFs organized by tags from other GifMe users. GifMe is available with a free download for desktop and mobile devices.
Free Patterns & Background Images
Your next email template may not be complete without a pattern, but not just any design will do. No matter what kind of design you're seeking - abstract, minimal, geometric, or something else - the next few tools will help you find what you're looking for.
- Subtle Patterns provides exactly what you expect from the name - minimal and subtle background patterns that are ready to use. This website provides over 400 patterns to you, and what's especially cool about Subtle Patterns is that you can preview the patterns on their website before you decide to download them. This way you can make sure you find the right one for you!
- Vecteezy offers thousands of free background patterns and vector art on their website. Vecteezy also provides free vector icons, which you might find useful if you want to include custom social media icons in your email template, for example.
Created from a worldwide community of graphic designers, you're bound to find creative vector art and patterns to enhance your next email template here.
- Pinterest is a great resource for nearly everything related to design, and email templates are no exception! Search their website for unique and free background patterns that you can't find anywhere else. If you're a Pinterest user, you can also create your own custom boards to refer back to in the future.
A small selection of the templates available on Pinterest below:
- Freepik, a popular search engine for free vector art, has a selection of over 10,000 background patterns that you can explore by color, or by narrowing down the results with your own keywords.
In addition to their wide background patterns selection, you can also find thousands of creative logos, banners, frames, and infographics for any of your design projects.
- Pattern Cooler is a tool for creating custom colored and textured patterns for your next email template.
Choose from over 600 designs to find the perfect one to make your next email template stand out. You can edit the final copy to match your color scheme, or you can even generate a new, random color scheme for some inspiration.
General Design & Tutorials
Are you a beginner to email design, or just want to refresh your design practices? Either way, we have a few go-to sources to explore to guide your next design. Check them out below:
- Canva Design School provides hundreds of free design resources and tutorials for designers of all levels. Created by designers, Canva's Design School allows you to create exceptional designs for branding your company or even your own personal design interests.
There are also plenty of unique tutorials that are worth while to check out - simply create a free account to gain access. You can find tutorials to help you with nearly every aspect of email design, such as choosing the right font, organizing your template layouts, and enhancing your images.
Check out a small handful of their tutorials below:
- Interface Sketch is a useful tool for designers who prefer to start on paper, with a hand-drawn sketch.
Using Interface Sketch, you can download various sizes of PDF sketch pads that you can print and use to sketch out your next designs. There are sketch pad sizes for most smartphones and tablets, and even a web browser.
Some of the available smartphone templates can be seen below.
- MailChimp has compiled a great email design resource list from their own tools.
Articles range from topics in mastering email design, email marketing, and HTML email development. If you have a specific question related to email design, marketing, or constructing your own HTML email, you will likely find some helpful guidance here. They are designed to help you every step of the way.
- Litmus Community provides designers and marketers a Stackexchange like forum where they can discuss about email marketing / coding related questions.
For any questions you still have unanswered, try asking the Litmus Community by posting your own discussion. Make sure to search previously posted discussions to see if your issue has already been addressed.
If you liked this article, I'm sure you'll like future ones too. We aim to bring you top quality content. We don't compromise on quality instead publish less. Subscribe to our bi-weekly newsletter below to get the latest piece delivered to your inbox.