How do you make a gradient progress bar in JavaFX?

Question

I want to achieve this: https://images.app.goo.gl/rH7o4hssPt1mLeEM9

Currently I've made a progress bar with -fx-accent: #87CEEB;

But I want it to be a linear gradient: linear-gradient(to right, #87CEEB, #2980b9);

How can I make it?

Answer 1

You just have to use CSS to select the bar of the progress-bar:

.progress-bar .bar {
    -fx-background-color: linear-gradient(to right, #87CEEB, #2980b9);
}

Then just add your stylesheet to your scene:

scene.getStylesheets().add("Style.css");