JAVA FX FORM DESIGN WITH EXTERNAL CSS DESIGN

JAVA FX FORM DESIGN WITH EXTERNAL CSS DESIGN

import javafx.application.Application;
import javafx.geometry.Insets;
import javafx.scene.Scene;
import javafx.scene.control.Button;
import javafx.scene.control.Label;
import javafx.scene.control.TextField;
import javafx.scene.effect.DropShadow;
import javafx.scene.effect.Reflection;
import javafx.scene.layout.BorderPane;
import javafx.scene.layout.GridPane;
import javafx.scene.layout.HBox;
import javafx.scene.layout.VBox;
import javafx.scene.text.Font;
import javafx.scene.text.FontWeight;
import javafx.stage.Stage;

public class Dataneed extends Application
{

    @Override
    public void start(Stage arg0) throws Exception
    {
        // Border Pane
        BorderPane bn=new BorderPane();
        bn.setId("bp");
        // HBox
        HBox hb=new HBox();
        hb.setSpacing(50);
        hb.setPadding(new Insets(10,30,20,40));
        hb.setStyle("-fx-background-color: #336699;");
        //Label
        Label uname=new Label("USER NAME");
        Label pwd=new Label("PASSWORD");
        //pwd.setEffect(ds);
        //SETTING FONT STYLE
        pwd.setFont(Font.font("Arial",FontWeight.BOLD,40));
        pwd.setId("text");
        //pwd.setPrefSize(300,300);
        //Drop Shadow Effect
        DropShadow ds=new DropShadow();
        ds.setOffsetX(10);
        ds.setOffsetY(20);
        //SETTING EFFECT TO DROP SHADOW
        uname.setEffect(ds);
        uname.setFont(Font.font("Arial",FontWeight.BOLD, 40));
        uname.setId("text");
        uname.setPrefSize(300,300);
        hb.getChildren().addAll(uname);
        HBox hb2=new HBox();
        hb2.setSpacing(50);
        hb2.setPadding(new Insets(10,30,20,40));
        VBox vb=new VBox();
        vb.setSpacing(50);
        vb.setPadding(new Insets(10,30,20,40));
        // SETTING BACKGROUND STYLE AND COLOR
        vb.setStyle("-fx-background-color: #336699;");
        //VERTICAL BOX
        VBox vb2=new VBox();
        vb2.setSpacing(50);
        vb2.setPadding(new Insets(10,30,20,40));
        vb2.setStyle("-fx-background-color: #336699;");
        bn.setLeft(vb);
        bn.setRight(vb2);
        hb2.setStyle("-fx-background-color: #336699;");
        Button b1=new Button("BUTTON F1");
        Button b2=new Button("BUTTON F2");
        Button b3=new Button("BUTTON F3");
        Button b4=new Button("BUTTON F4");
        bn.setTop(hb);
        bn.setBottom(hb2);
        //hb.getChildren().addAll(b1,b2);
        //hb2.getChildren().addAll(b3,b4);
        TextField tf=new TextField();
        tf.setPromptText("ENTER USER NAME");
        TextField tf1=new TextField();
        tf1.setPromptText("ENTER PASSWORD");
        Button lgbtn=new Button("LOGIN");
        lgbtn.setId("btnLogin");
        HBox bt=new HBox();
        bt.setPadding(new Insets(20,20,30,30));
        //bn.setTop(bt);
        GridPane gp=new GridPane();
        gp.setPadding(new Insets(0,20,10,30));
        gp.setId("root");
        Reflection r=new Reflection();
        r.setFraction(0.7f);
        gp.setEffect(r);
        gp.add(uname, 0, 0);
        gp.add(tf, 1, 0);
        gp.add(pwd, 0,1);
        gp.add(tf1, 1, 1);
        gp.add(lgbtn, 3, 1);
        bn.setCenter(gp);
        Scene scene=new Scene(bn);
        scene.getStylesheets().add(getClass().getClassLoader().getResource("login.css").toExternalForm());
        arg0.setScene(scene);
        arg0.setTitle("TESTING APP");
        arg0.show();
        ///bn.setTop(value);
       
    }
    public static void main(String args[])
    {
        launch(args);
    }
   

}

CSS FILE:

#root
{
 -fx-background-color:  linear-gradient(lightgray, gray);
 -fx-border-color: white;
 -fx-border-radius: 10;
 -fx-padding: 10 10 10 10;
 -fx-background-radius: 20;

}

#bp
{
 -fx-background-color:  linear-gradient(gray,DimGrey );
}

#btnLogin {
    -fx-background-radius: 30, 30, 29, 28;
    -fx-padding: 3px 10px 3px 10px;
    -fx-background-color: linear-gradient(blue, orangered );
   
}

#text
 {

 -fx-fill:  linear-gradient(orange , orangered);

}

OUTPUT: