background gradient of different colors code example

Example 1: linear gradient css

/* A gradient tilted 100 degrees,
   starting gray and finishing black */

.class {
    background: linear-gradient(100deg, rgba(63, 63, 63, 0.8) 0%, rgba(255, 255, 255, 0) 25%);
}

/* A gradient going from the bottom to top
   starting red and finishing orange */

.class {
    background: linear-gradient(to top, #f32b60, #ff8f1f);
}

Example 2: ui gradient

background: #000428; /* fallback for old browsers */
  background: -webkit-linear-gradient(to bottom, #000428, #004e92); /* Chrome 10-25, Safari 5.1-6 */
  background: linear-gradient(to bottom, #000428, #004e92); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */

Tags:

Css Example