Fungsi CSS repeating-radial-gradient()

Definisi dan penggunaan

CSS repeating-radial-gradient() Fungsi digunakan untuk gradient radial yang diulang.

Gradient radial	Gradient radial yang diulang

radial-gradient(red, yellow, green);	repeating-radial-gradient(red, yellow 10%, green 15%);

Sebuah gradient radial yang diulang:

#grad {
  background-image: repeating-radial-gradient(red, yellow 10%, green 15%);
}

Gradasi radial yang diulang lainnya, menetapkan bentuk, ukuran dan posisi:

#grad1 {
  background-image: repeating-radial-gradient(ellipse farthest-corner at 25% 25%, red, yellow 10%, green 15%);
}

Gradasi radial yang diulang lainnya, menetapkan dua posisi berhenti warna:

#grad1 {
  background-image: repeating-radial-gradient(red 0% 10%, yellow 11% 21%, green 22% 32%);
}

repeating-radial-gradient(shape size at position, start-color, ... , last-color);

Nilai	Deskripsi
shape	Tentukan bentuk gradien. Nilai yang mungkin: ellipse (baku) circle
size	Tentukan ukuran gradien. Nilai yang mungkin: farthest-corner (baku) closest-side closest-corner farthest-side
at position	Tentukan posisi gradien. Nilai baku adalah "center".
start-color, ... , last-color	Titik pengakhiran warna adalah warna yang Anda inginkan untuk muncul transisi lancar di antaranya. Nilai ini terdiri dari nilai warna dan satu atau dua posisi berhenti pilihan (persen dari 0% hingga 100% atau panjang di sepanjang sumbu gradien).