Colour gradients are a great way to add sleek color and depth to a design. They are versatile, easy to use, and can be used in many different ways. They can be subtle or bold, wide or narrow, matte or glossy - the list is endless!
But sometimes it can be difficult to find gradients that work well together.
That's why we have put together 12 tools that will help you create your own gradients and create beautiful designs.
Grabient is an online tool for creating gradients. It offers a wide range of pre-made gradients that you can quickly and easily customize and download.
Website: https://www.grabient.com/
Type: Free
CoolHue is a tool that allows you to create great color palettes for your projects.
Website: https://webkul.github.io/coolhue/
Type: Free
182 carefully crafted gradients for free use in your designs.
Website: https://gradienta.io/
Type: Free
Gradient Hunt is a free and open platform for color inspiration with thousands of trendy, handmade gradients.
Website: https://gradienthunt.com/
Type: Free
WebGradients is a free collection of 180 linear gradients that you can use as backgrounds for content on any area of your website. Simply copy the CSS3 code for cross-browser compatibility and use it in no time. There is also a PNG version of each gradient. As a bonus, there are packages for Sketch & Photoshop.
Website: https://webgradients.com/
Type: Free
Website with millions of automatically generated gradients.
Website: https://gradihunt.com/
Type: Free
CSS Gradient is a website and free tool that allows you to create gradient backgrounds for websites. The website is not only a CSS gradient generator but also packed with colourful content about gradients, from technical articles to real gradient examples like Stripe and Instagram.
Website: https://cssgradient.io/
Type: Free
With Mesh Gradients, you can download 100 free mesh gradients in .sketch, .png, .ai, .jpg, .eps formats.
Website: https://products.ls.graphics/mesh-gradients/
Type: Free
Meshgradients is a tool that offers a collection of Mesh Gradient collections.
Website: https://www.meshgradients.design/
Type: Free
A free platform with 48 linear gradients selected by designers for use as backgrounds for digital artworks.
Website: https://www.designgradients.com/
Type: Free
Selected mesh gradients for your next design project, website, flyer, app, wallpaper, brochure, etc., for download and use.
Website: https://ingradients.net/
Type: Free + Paid Options
With Gradientos, you can quickly test how different gradients would look on some common UI elements and copy them directly if needed.
Website: https://www.gradientos.app/editor
Type: Free