Web design is an ever-evolving industry.
But thankfully there are many tools and resources available out there for us to learn from.
Whether you need to design a complete website from scratch or redesign an existing one, the internet is full of resources to help you speed up the process.
And today I’ll show you some of my personal favourite web design resources that you may also find helpful.
Let’s jump in!
Coolers is a colour palette generator that helps you mix and match colours for any design project.
You can also create a matching colour palette based on a specific colour of your choice, making it a great tool for finding a complementary colour for your designs.
Alternatively, you can browse their “Trending Colour Palettes” for inspiration, brainstorming sessions or creating mockups.
The tool also offers a colour contrast checker that calculates the contrast ratio of text and background colours by following the Web Content Accessibility Guidelines (WCAG), ensuring your design is more accessible to those with visual impairments.
Fontshare is a great site to get modern, elegant and high quality fonts for free.
Their professional grade font collection continues to grow and they are 100% FREE for personal and commercial use. So you won’t need to worry about licences and rights of use when using fonts from here.
You can also check out their pairing section which offers around 60 different combination pairings, ready to be used or be inspired for your next design projects in no time.
Design Gradients is a free platform that offers 48 linear gradients curated by designers to use as content backgrounds in any kind of digital art and design. It is a simple tool but very useful to anyone looking for beautiful gradients to use in their project.
Want to see how they look against dark backgrounds?
Simply switch to dark mode and there you have it! On the desktop version, it allows you to copy the HEX or CSS code of the gradients, whereas on the mobile version, it lets you copy the colours as PNG for social media or with other design apps.
Blush Design provides an impressive library of ready-made illustrations created by talented artists across the globe. You can use their illustrations for personal as well as commercial purposes with unlimited copies.
You can either let Blush create a random illustration pack, or search and filter a specific style that you’re looking for. Then customise and play around with the variations of the art to fit your projects with the ability to download PNG and SVG versions of your design.
*Please note that some features might require the Pro membership which costs $12 a month.
Designer Up is a learning platform where designers can learn UI/UX design online. The resources are trusted by students and companies like Google, Figma and more. There are tons of free tutorials, articles, podcast episodes, webinars and UI design courses for designers ranging from beginners to advanced level. So if you’re looking to step up in your UI/UX design skills, then definitely check this out.
This website showcases some of the best design systems from different brands, showing you examples, tools, articles and talks related to design systems and methods.
No matter what design level you are on, knowing how to create a structured design system is one of the skills every designer should have.
Webflow has been one of the fastest growing no-code website builders within the past few years. And within their university you can find plenty of free resources to explore. For example, Made in Webflow is a great place to start for those who are looking for inspiration.
There’s also Webflow TV curated with different talks, podcasts, documentaries and stories of creativity, entrepreneurship, and design videos to choose from.
And there’s more!
Webflow University has plenty of free web design courses and hundreds of tutorials that cover everything from web design layout to typography, interactions.
They launch lessons frequently to keep you on top of the latest trends, and their library continues to expand!
Now who doesn’t love a checklist?
Checklisting is a great habit to have, it allows you to keep your mind clear and organise effectively so you don’t miss a task.
It’s the same principle here when designing, things can get complex fairly quickly and keeping all the information in your head often prevents you from being creative.
Checklist Design is a free website that gives you tons of checklists and design guidelines from icon design, navigation menus, different web pages, UI components, branding assets and more, saving you the effort of going back and forth checking and picking up whatever fell through the cracks.
There you have it!
8 web design resources to try out.
The majority of what I've covered today are free tools and resources, so hopefully these will help you elevate your designs!