CSS-এ গ্রেডিয়েন্টের প্রকারভেদ

গ্রেডিয়েন্ট দুটি বা তার বেশি কালারের কোম্বিনেশন প্রদর্শন করে।

গ্রেডিয়েন্টের প্রকারভেদ নিচে দেওয়া হলো:

গ্রেডিয়েন্টের প্রকার

• লিনিয়ার গ্রেডিয়েন্ট (নিচে/উপরে/বামে/ডানে/ডায়াগোনালি)
• রেডিয়াল গ্রেডিয়েন্ট

উদাহরণ

রেডিয়াল গ্রেডিয়েন্টের একটি উদাহরণ দেখি:

<html>
  <head>
    <style>
      #grad1 {
        height: 100px;
        width: 550px;
        background: -webkit-radial-gradient(red 5%, green 15%, pink 60%);
        background: -o-radial-gradient(red 5%, green 15%, pink 60%);
        background: -moz-radial-gradient(red 5%, green 15%, pink 60%);
        background: radial-gradient(red 5%, green 15%, pink 60%);
      }
    </style>
  </head>
  <body>
    <div id="grad1"></div>
  </body>
</html>