This is a short tutorial about some JavaFX elements like ellipses, circles, effects and gradients.

In the first code we are creating a frame with a ellipse with center in (120,140), 60 pixels of horizontal radius, 20 pixels of vertical radius and color black. We have also a circle with center in (100,100), 50 pixels of radius and color red. The idea is make this circle appears like a sphere and make the ellipse look like a shadow.

```import javafx.application.*;
import javafx.scene.paint.*;
import javafx.scene.geometry.*;

Frame {
title: "JavaFX Sphere", width: 300, height: 300, visible: true
stage: Stage {
content: [
Ellipse {
centerX: 120, centerY: 140, radiusX: 60, radiusY: 20
fill: Color.BLACK
},
Circle { centerX: 100, centerY: 100, radius: 50, fill: Color.RED }
]
}
}```

Now we will just add two thing, a effect and a radial gradient.

First we’ll just add javafx.scene.effect.* to our import list and just call the gaussian blur effect in our ellipse with

`effect: GaussianBlur{ radius: 20 }`

This creates a gaussian blur of radius 20. The first ellipse was like

and now with the effect becomes

Now we create a radial gradient for the circle appears like a sphere. We do that using the RadialGradient class at

```RadialGradient {
centerX: 75, centerY: 75, radius: 50, proportional: false
stops: [
Stop {offset: 0.0 color: Color.WHITE},
Stop {offset: 0.3 color: Color.RED},
Stop {offset: 1.0 color: Color.DARKRED},
]
}```

First lets look at the gradient. It starts with a white color, going to red during the first 30% of the way. The remaining of the way is the color red going to a dark red. It creates a gradient like this one:

But it is a radial gradient, with center in (75,75) and radius 50. So this radial gradient looks like this:

As we place this radial gradient in our circle, it was like this:

And now is like this:

Now the complete code. I guess it’s simple and also concise.

```import javafx.application.*;
import javafx.scene.paint.*;
import javafx.scene.effect.*;
import javafx.scene.geometry.*;

Frame {
title: "JavaFX Sphere", width: 300, height: 300, visible: true
stage: Stage {
content: [
Ellipse {
centerX: 120, centerY: 140, radiusX: 60, radiusY: 20
fill: Color.BLACK
effect: GaussianBlur{ radius: 20 }
},
Circle {
centerX: 100, centerY: 100, radius: 50
centerX: 75, centerY: 75, radius: 50, proportional: false
stops: [
Stop {offset: 0.0 color: Color.WHITE},
Stop {offset: 0.3 color: Color.RED},
Stop {offset: 1.0 color: Color.DARKRED},
]
}
}
]
}
}```

Here is the final screenshot: