• Home
  • Design
  • Tips
  • Advertising
  • Inspiration
  • Buzz
  • Follow Us ▾
    • Via E-mail
    • Facebook
    • Twitter
    • Instagram
    • LinkedIn
    • Pinterest

Digital Synopsis

Design, Advertising & Creative Inspiration

  • Design Trends
  • Logo Design
  • Photoshop
  • Colors
  • Typography
  • Web Design
  • Humor
  • About Us
  • Advertise

30 Beautiful Color Gradients For Your Next Design Project

Looking for cool background gradients for your UI? Software and design company Itmeo has created a useful online tool called WebGradients – a free collection of 180 linear gradients that you can use as content backdrops in any part of your website. You can download a .PNG version of each gradient and copy their CSS3 cross-browser codes. Sketch and Photoshop packs are available as well. Here are some of our favourites from the collection.

1. Warm Flame

Pink color gradient, shades, background
#ff9a9e → #fad0c4

2. Juicy Peach

Skin color gradient, shades, background
#ffecd2 → #fcb69f

3. Lady Lips

Pink color gradient, shades, background
#ff9a9e → #fecfef

4. Winter Neva

Blue color gradient, shades, background
#a1c4fd → #c2e9fb

5. Heavy Rain

Grey color gradient, shades, background
#cfd9df → #e2ebf0

6. Cloudy Knoxville

White & Grey color gradient, shades, background
#fdfbfb → #ebedee

7. Saint Petersberg

Grey color gradient, shades, background
#f5f7fa → #c3cfe2

8. Plum Plate

Purple color gradient, shades, background
#667eea → #764ba2

9. Everlasting Sky

Grey color gradient, shades, background
#fdfcfb → #e2d1c3

10. Happy Fisher

Blue color gradient, shades, background
#89f7fe → #66a6ff

11. Fly High

Blue color gradient, shades, background
#48c6ef → #6f86d6

12. Strong Bliss

Pink & Orange color gradient, shades, background
Multiple colors

13. Fresh Milk

Pink skin color gradient, shades, background
#feada6 → #f5efef

14. Great Whale

Blue color gradient, shades, background
#a3bded → #6991c7

15. Aqua Splash

Green & Blue color gradient, shades, background
#13547a → #80d0c7

16. Clean Mirror

Grey color gradient, shades, background
#93a5cf → #e4efe9

17. Premium Dark

Black color gradient, shades, background
#434343 → #000000

18. Cochiti Lake

Grey color gradient, shades, background
#93a5cf → #e4efe9

19. Passionate Bed

Pink color gradient, shades, background
#ff758c → #ff7eb3

20. Mountain Rock

Grey color gradient, shades, background
#868f96 → #596164

21. Desert Hump

Brown color gradient, shades, background
#c79081 → #dfa579

22. Eternal Constance

Blue color gradient, shades, background
#09203f → #537895

23. Healthy Water

Green color gradient, shades, background
#96deda → #50c9c3

24. Vicious Stance

Grey color gradient, shades, background
#29323c → #485563

25. Nega

Pink color gradient, shades, background
#ee9ca7 → #ffdde1

26. Night Sky

Blue color gradient, shades, background
#1e3c72 → #2a5298

27. Gentle Care

Pink color gradient, shades, background
#ffc3a0 → #ffafbd

28. Angel Care

Pink color gradient, shades, background
Multiple colors

29. Morning Salad

Green color gradient, shades, background
#B7F8DB → #50A7C2

30. Deep Relief

Blue color gradient, shades, background
Multiple colors

SEE MORE …

How To Use Gradients

Unless you’re stuck in the 90s, gradients are best used in moderation. Here’s a handy infographic by Creative Market that explains the different types of gradients, tool terminology and offers tips and suggestions on best practices.

Share this post with a designer friend and voice your views in the comments below.


Don't Miss:

  • color-thesaurus-correct-names-shadesIt’s “Wine”, Not Dark Red – Here Are The Correct Names Of All Color Shades
  • Color Palettes From Famous Movies Show How Colors Set The Mood Of A FilmColor Palettes From Famous Movies Show How Colors Set The Mood Of A Film
  • 8 Beautiful Color Palettes For Your Next Design Project8 Beautiful Color Palettes For Your Next Design Project
  • Beautiful, Minimal Photographs Of Sunsets For Color InspirationBeautiful, Minimal Photographs Of Sunsets For Color Inspiration
  • 12 Funny Charts That Highlight The Importance Of Color12 Funny Charts That Highlight The Importance Of Color
  • 50 Beautiful Color Combinations For Your Next Design Project50 Beautiful Color Combinations For Your Next Design Project

Share Your Views



POPULAR
LOGO INSPIRATION
COLOR PALETTES
FREE FONTS
DESIGN HUMOR
BRILLIANT ADS

Popular

  • This Guy Photoshopped Himself Into His Childhood Pics To Hang Out With His Younger Self
  • 32 Beautiful Color Palettes With Their Corresponding Gradient Palettes
  • 60 Powerful Social Issue Ads That'll Make You Stop And Think
  • Elderly People Look At Their Younger Reflections In This Beautiful Photo Series By Tom Hussey
  • Color Palettes From Famous Movies Show How Colors Set The Mood Of A Film

Trending

  • Top 10 Logo Design Trends For 2020
  • 2020 Color Trends: The World’s Most Popular Colors
  • How To Convert 2D Images To 3D In Photoshop
  • 47 Beautiful Color Schemes For Your Next Design Project
  • This Hidden Photoshop Feature Lets You Crop And Straighten Multiple Photos In Just 1 Click

Search

Follow Us

- Email
- Facebook
- Twitter
- LinkedIn
- Pinterest
- Instagram

Copyright © 2012-2019 Digital Synopsis | Privacy Policy | Advertise With Us

sponsored