Got an awesome Smart Slider project in mind but not sure where to start? You’re in luck, as in this article we’ll help you get everything you need to start building your slider. Following our 5 point checklist you can create a well thought slider. Additionally, we listed our favorite places to get images, videos, fonts and colors. So, let’s see the best design resources for creating a slider!
1. Look for inspiration
Before you start building your slider, it’s worth taking time to look for inspiration. You can browse sites that have the same topic as your project to see what kind of content they add. I’ve collected four design resources to inspire you in your slider creation journey.
The new way to build a Slider
Next generation visual editor, customizable animations & effects, and access to hundreads of premade templates.
Of course one of the first places to go before starting your next project is our template page. We’ve got more than 100 sliders to browse for ideas. Additionally, you can import any of them and edit it to match your project.
Dibble is one of the best places to find and showcase creative work. You can find all kinds of content there from website layouts to product designs. So, you can be sure to find inspiration for your project.
One Page Love is a website design gallery showcasing the best Single Page websites, templates and resources. What’s great about One Page Love is that you can only find website designs there that were actually developed by someone. So the inspiration you can find here is an actual website, not only an image file.
Behance is a social media platform to showcase and discover creative work. Like on Dribbble, you can find much more than just website templates here. In fact, you can find illustrations, logo designs and digital drawings as well.
After you get inspired for your project, it’s time to find a color palette. Choosing the right color can be easier if you’re a designer, but if you’re not, don’t worry. There are plenty of super cool sites which offer ready to use color palettes. All you need to do is choose the one you like the most.
Also, don’t forget to make sure it fits your project as well. Here are some of the best sites to choose a color palette for your slider.
Coolors
Coolors is a fast color palette generator. You can generate a new palette by pressing the space key on your keyboard. If you get a color you like, clicking on the lock icon on it will make it “stick”. So when you press space the selected color will not change, but you’ll get colors that match your selection.
Colormind is a color scheme generator that uses AI to generate the perfect colors for you. It can learn color styles from photographs, movies, and popular art, which is really cool. You can lock colors you want and generate new colors instead of those you don’t.
You can find hand-picked color palettes on Colorhunt. You can filter the palettes by category. For example, if you’re looking for something modern, you can look in the Pastel category. However, if you need attention-grabbing colors, you can have a look at the Neon color section.
Creating a slider is often a lot more than just putting images together. Although pictures say more than a thousand words, it’s always a good idea to add text to clarify your message. Obviously, you need captivating text for your visitors to enjoy. But it also matters how the texts look, so which font family or families to use.
These are our favorite resources to find font design ideas for the sliders we create.
Typewolf
Typewolf helps you choose a great looking Google Font for your website. Additionally, it shows fonts that look great with your selected font. In fact, it includes visual examples of why these fonts harmonize so nicely.
100 days of fonts is a special project to design and code a creative showcase of a Google Font pairings for 100 days. It’s a great way to find great looking Google fonts and inspiration about how to use them in your project.
Now that you know what you want to create, what colors and fonts to use, it’s time to pick images for your slider. Of course, it’s always best to use your own images on your website. But if that’s not possible, there’s nothing wrong with using stock photos. Here are our favorite design resources to find stock images and videos for your slider.
When you download a stock image, it usually has high quality and resolution. As a result, the image has a large file size. For this reason we recommend resizing the image before you upload it to your website. As a result, they won’t slow your site’s loading time down. You can also use Smart Slider’s built in optimization options to optimize the image size.
Pexel
Pexels is a free stock photo and video website that helps everyone who is looking for visuals. Their huge library includes both photos and videos you can download and use in your slider. So, it doesn’t matter what you’re trying to create, you can find great materials on Pexel.
Pixabay has over 2.5 million high quality stock images, videos and music. You can also find illustrations and vectors as well. So, it’s a great way to find slider design resources for your project.
Unsplash helps you find beautiful, free images that you can download and use for any project. What’s cool about Unsplash is that they list the most popular image categories. As a result, you can browse pictures fast.
What makes Freepik stand out from the other resources is they don’t only offer images. In fact, they offer both hiqh-quality photos, vector images, illustrations and PSD files. So, Freepik is a great place to find slider design resources for everyone. Additionally, it has a huge library so you can surely find great images for your slider.
Mazwai is a resource for free stock videos. So, if you’d like to present a background video on your slider you’re in the best place. Although all videos you can find on Mazwai are free to use for any project, you must credit the author.
Icons are easy to understand and can grab the attention of the visitor. Additionally, they help to sum up what your text is about. For this reason it’s worth using icons on your website. We love using icons in the slider templates when possible. These are the best resources to get great icons for your slider.
Flaticon
Flaticon has more than 6.5 million vector icons and stickers for your projects. Additionally, all icons are available in PNG, SVG, EPS, PSD and BASE 64 formats. So, you’ll surely find the icon that fits your project the most.
Iconfinder is an icon marketplace. In other words, there are some icons you can only access after payment. Of course, there are still tons of free icons to choose from. In fact, you can browse 216,774 icons for free! However, if you want to access all 6 million icons, you have two options. First, you can pay for only those icons you need. Alternatively you can buy a subscription and use any paid icons as part of your subscription.
Font Awesome is one of the most popular font libraries. Additionally, it’s one of the font icons you can find in Smart Slider’s icon layer as well. So, integrating Font Awesome icons to your slider is super simple.
Get our latest news, tutorials, guides, tips & deals delivered to your inbox.
No spam. No charge. Just curated emails.
Conclusion
There are many awesome places where you can get inspiration or stock photos and videos for your slider. So, before you rush into the slider creation, take a step back. Look for inspiration, find great colors, font families and images for your slider. To help you work faster, we’ve listed our favorite design resources to create sliders. Feel free to go through the checklist when you start your next project!
Hi, I’m Ramona and I’m a member of Nextend‘s awesome support team. You’ve probably chat with me if you’ve submit a support ticket. When I’m not answering support emails I read a book or go cycling. I enjoy writing as well, both for our blog and for my private projects.
