أداة التدرج CSS عبر الإنترنت
CSS Gradient هو موقع ويب صغير سعيد وأداة مجانية تتيح لك إنشاء خلفية متدرجة لمواقع الويب.
تتيح لك تدرجات CSS عرض انتقالات سلسة بين لونين محددين أو أكثر.
تحدد CSS نوعين من التدرجات اللونية:
- التدرجات الخطية (تنخفض / لأعلى / يسار / يمين / قطريًا)
- التدرجات الشعاعية (محددة بمركزها)
التدرجات الخطية CSS
لإنشاء تدرج خطي ، يجب عليك تحديد توقفي لوني على الأقل. التوقفات اللونية هي الألوان التي تريد تجسيد انتقالات سلسة بينها. يمكنك أيضًا تعيين نقطة بداية واتجاه (أو زاوية) مع تأثير التدرج اللوني.
بناء الجملة
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: