title: How to create a background grid
body: <p>I'd like to create a grid as a background for my JavaFX application. My current solution is to paint a rectangle on a canvas, create an image pattern from it and set it as fill.</p>
  
  <p><strong>Question</strong>: Is there a better way to approach this, preferrably via CSS?</p>
  
  <p>Current version:</p>
  
  <pre><code>public class BackgroundGrid extends Application {
  
      double gridSize = 20;
  
      @Override
      public void start(Stage primaryStage) {
  
          Scene scene = new Scene(new Group(), 800, 600);
          primaryStage.setScene(scene);
          primaryStage.show();
  
          scene.setFill(createGridPattern());
  
      }
  
      public ImagePattern createGridPattern() {
  
          double w = gridSize;
          double h = gridSize;
  
          Canvas canvas = new Canvas(w, h);
          GraphicsContext gc = canvas.getGraphicsContext2D();
  
          gc.setStroke(Color.BLACK);
          gc.setFill(Color.LIGHTGRAY.deriveColor(1, 1, 1, 0.2));
          gc.fillRect(0, 0, w, h);
          gc.strokeRect(0, 0, w, h);
  
          Image image = canvas.snapshot(new SnapshotParameters(), null);
          ImagePattern pattern = new ImagePattern(image, 0, 0, w, h, false);
  
          return pattern;
  
      }
  
      public static void main(String[] args) {
          launch(args);
      }
  }
  </code></pre>
  
  <p><img src="https://i.stack.imgur.com/BclxI.png" alt="enter image description here"></p>
  
  <p>Thank you very much!</p>
  
  <p>Edit: in order to get sharp grid lines, just use</p>
  
  <pre><code>gc.strokeRect(0.5, 0.5, w, h);
  </code></pre>
  
  <p>I think that wouldn't be doable in CSS, isn't it?</p>
  
  <p><img src="https://i.stack.imgur.com/bXPEE.png" alt="enter image description here"></p>