شیب رنگ شعاعی در SVG

<radialGradient> یا شیب رنگ شعاعی

از عنصر <radialGradient> برای تعریف یک شیب رنگ شعاعی استفاده می شود. 

عنصر <radialGradient> باید در داخل یک تگ <defs> قرار بگیرد. تگ <defs> مخفف کلمه ی definition است و دربردارنده ی عناصر خاص می باشد( مانند شیب رنگ ها).

مثال 1

ایجاد یک بیضی به همراه یک شیب رنگ شعاعی از رنگ سفید به رنگ آبی:

کد SVG مورد نظر، در زیر قرار دارد:

توضیح کد بالا:

• خصوصیت id که در تگ <radialGradient> قرار دارد، یک نام یکتا را برای شیب رنگ تعریف می کند. 
• خصوصیات cx و cy و r دایره ی بیرونی را تعریف می کنند و خصوصیات fx و fy دایره ی درونی را تعریف می کنند. 
• یک شیب رنگ می تواند از دو یا چند رنگ تشکیل شود. هر رنگ به وسیله ی یک تگ <stop> تعریف می شود. خصوصیت offset مشخص می کند که رنگ شیب رنگ، از کجا شروع شود و در کجا پایان یابد. 
• خصوصیت fill، بیضی را به شیب رنگ متصل می کند. 

مثال 2

تعریف یک بیضی دیگر به همراه شیب رنگ شعاعی، از رنگ سفید تا رنگ آبی:

کد SVG مورد نظر در زیر قرار دارد:

• قبلی