Encode text into QR Code with zxing and display it using thymeleaf. Live demo here.

You can find the complete code for this here.

This is the method to encode a String into an image, and then encode the image into a base 64 String that represents the png, based around the code in this tutorial.


  private String unsafeCreateQRImage(String qrCodeText, int size)
      throws WriterException, IOException {
    // Create the ByteMatrix for the QR-Code that encodes the given String
    Hashtable<EncodeHintType, ErrorCorrectionLevel> hintMap = new Hashtable<>();
    hintMap.put(EncodeHintType.ERROR_CORRECTION, ErrorCorrectionLevel.L);
    BitMatrix byteMatrix =
        qrCodeWriter.encode(qrCodeText, BarcodeFormat.QR_CODE, size, size, hintMap);
    // Make the BufferedImage that are to hold the QRCode
    int matrixWidth = byteMatrix.getWidth();
    BufferedImage image = new BufferedImage(matrixWidth, matrixWidth, BufferedImage.TYPE_INT_RGB);

    Graphics2D graphics = (Graphics2D) image.getGraphics();
    graphics.fillRect(0, 0, matrixWidth, matrixWidth);
    // Paint and save the image using the ByteMatrix

    for (int i = 0; i < matrixWidth; i++) {
      for (int j = 0; j < matrixWidth; j++) {
        if (byteMatrix.get(i, j)) {
          graphics.fillRect(i, j, 1, 1);
    ByteArrayOutputStream bos = new ByteArrayOutputStream();
    ImageIO.write(image, "png", bos);
    byte[] imageBytes = bos.toByteArray();

    Base64.Encoder encoder = Base64.getEncoder();
    return encoder.encodeToString(imageBytes);

Use this on the controller for the thymeleaf templates.


  public String newRandomSelect(Model model) {
    model.addAttribute("textAndQRImage", new TextAndQRImage());
    return "inputQR";

  public String showQR(Model model, TextAndQRImage textAndQRImage, HttpSession session) {
    if (Objects.isNull(textAndQRImage.getText()) || textAndQRImage.getText().isEmpty()) {
      return "redirect:/simpleqr/";
    String qrImage = qrCreator.createQRImage(textAndQRImage.getText(), 800);
    if (Objects.isNull(qrImage) || qrImage.isEmpty()) {
      return "redirect:/simpleqr/";
    textAndQRImage.setBase64Image(qrCreator.createQRImage(textAndQRImage.getText(), 800));

    model.addAttribute("textAndQRImage", textAndQRImage);
    return "showQR";

Part of inputQR.html that asks for the text that will be encoded into a QR code.

    <form action="/simpleqr/show" th:object="${textAndQRImage}" method="POST">

        <input type="text" placeholder="input text here" th:field="*{text}">

        <button type="submit">Generate QR</button>

And then we display the QR code in showQR.html template.


        <img class="img-responsive" th:src="@{'data:image/png;base64,'+${textAndQRImage.base64Image}}"/>

<h2 th:text=${textAndQRImage.text}></h2>

Download the complete code for this here: simple-qr code. Live demo on: simple-qr live.