Alat Gradien CSS Online
CSS Gradient adalah situs web kecil yang menyenangkan dan alat gratis yang memungkinkan Anda membuat latar belakang gradien untuk situs web.
Gradien CSS memungkinkan Anda menampilkan transisi yang mulus antara dua atau lebih warna yang ditentukan.
CSS mendefinisikan dua jenis gradien:
- Gradien Linear (turun/atas/kiri/kanan/diagonal)
- Gradien Radial (ditentukan oleh pusatnya)
Gradien Linear CSS
Untuk membuat gradien linier, Anda harus menentukan setidaknya dua perhentian warna. Perhentian warna adalah warna yang Anda inginkan untuk membuat transisi yang mulus. Anda juga dapat mengatur titik awal dan arah (atau sudut) bersama dengan efek gradien.
Sintaksis
background-image: linear-gradient(direction, color-stop1, color-stop2, ...);
CSS Radial Gradients
A radial gradient is defined by its center.
To create a radial gradient you must also define at least two color stops.
Syntax
background-image: radial-gradient(shape size at position, start-color, ..., last-color);
By default, shape is ellipse, size is farthest-corner, and position is center.
Set Shape
The shape parameter defines the shape. It can take the value circle or ellipse. The default value is ellipse.
The following example shows a radial gradient with the shape of a circle:
