gradient bg 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: css linear gradient

#grad {
  background-image: linear-gradient(to right, #f1b1b1 , #82e6e8);

}

Example 3: linear-gradient

background: linear-gradient(to left, #333, #333 50%, #eee 100%);

Example 4: gradient css background

/*From bottom to top*/
background: rgb(166,166,166);
background: linear-gradient(0deg, rgba(166,166,166,1) 0%, rgba(255,255,255,1) 29%);

Example 5: gradient color

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item><shape>
        <solid android:color="@android:color/black" />
    </shape></item>

    <item><rotate android:fromDegrees="66" android:toDegrees="0" android:pivotY="50%" android:pivotX="50%"><shape>
        <gradient
            android:type="sweep"
            android:centerX="0.3"
            android:centerY="0.5"
            android:startColor="@android:color/holo_red_dark"
            android:centerColor="@android:color/transparent"
            android:endColor="@android:color/transparent"/>
    </shape></rotate></item>

    <item><rotate android:fromDegrees="290" android:toDegrees="0" android:pivotY="40%" android:pivotX="30%"><shape>
        <gradient
            android:type="sweep"
            android:centerX="0.8"
            android:centerY="0.3"
            android:startColor="@android:color/holo_blue_dark"
            android:centerColor="@android:color/transparent"
            android:endColor="@android:color/transparent"/>
    </shape></rotate></item>

    <item><rotate android:fromDegrees="18" android:toDegrees="0" android:pivotY="40%" android:pivotX="30%"><shape>
        <gradient
            android:type="sweep"
            android:centerX="0.1"
            android:centerY="0.5"
            android:startColor="@android:color/holo_green_dark"
            android:centerColor="@android:color/transparent"
            android:endColor="@android:color/transparent"/>
    </shape></rotate></item>

    <item><rotate android:fromDegrees="280" android:toDegrees="0" android:pivotY="50%" android:pivotX="30%"><shape>
        <gradient
            android:type="sweep"
            android:centerX="0.6"
            android:centerY="0.7"
            android:startColor="@android:color/holo_orange_dark"
            android:centerColor="@android:color/transparent"
            android:endColor="@android:color/transparent"/>
    </shape></rotate></item>

    <item><rotate android:fromDegrees="0" android:toDegrees="0" android:pivotY="50%" android:pivotX="30%"><shape>
        <gradient
            android:type="sweep"
            android:centerX="0.0"
            android:centerY="0.0"
            android:startColor="@android:color/holo_purple"
            android:centerColor="@android:color/transparent"
            android:endColor="@android:color/transparent"/>
    </shape></rotate></item>

</layer-list>