Shape & Size:

ellipse 50% 50% → The gradient is an ellipse with width and height each 50% of the element.

at 50% 50% → The ellipse is centered in the element (50% from top, 50% from left).

The size of the hue is relative to the size of the box that it's inside.

Color Stops:

Each rgba() defines a color and its position along the gradient:

• rgba(255,255,255,0.22) 0% → Brightest white at the center (22% opacity).
• rgba(255,255,255,0.10) 30% → Slightly dimmer as you move outward.
• rgba(255,255,255,0.03) 45% → Almost transparent.
• rgba(255,255,255,0) 58% → Fully transparent edge.