Different time & date from the database and what shown at my web page using Spring MVC

I have some issue about my date & time that I've stored at the database (using SQL) it's different when I show it at my web page. There's different at date & time it self.

For example :

Stored in DB : 2023-05-20 18:12:48 (Right Date & Time)

At Web Page : 2023-05-21 01:12:48.0 (Wrong Date & Time)

I've set the default date & time based on right now time, so when the user click the button they will save the date & time by the time when they click at it.

The date & time that stored in database it's the right one. But when I show it at the web page, it's comes out different (wrong date & time at the page).

This's the entities table :

@Entity
@Table(name = "attendance_check_in")

public class AttendanceCheckIn {

     @Column(name = "check_in")
     @Temporal(TemporalType.TIMESTAMP)
     private Date checkIn;

     //getter & setter//

I'am using SQL database and using Spring. Here's my controller that handle the save request to the database :

@RequestMapping(value = "/attendance-input", method = RequestMethod.POST)
 public String inputAttendance(Model model, AttendanceCheckIn attendanceIn, Authentication auth) throws ParseException {

      model.addAttribute("attendanceIn", new AttendanceCheckIn());
      LocalDateTime ldt = LocalDateTime.now();
      Date in = Date.from(ldt.toInstant(ZoneOffset.UTC));
      attendanceIn.setCheckIn(in);
      attendanceInServ.save(attendanceIn);

      return "redirect:/attendance";
 }

So, basically I've set the default value for date & time as right now time. So when the button clicked it's store the value, and the value that stored in database is right as what I want. This is the date & time that saved in database :

But when I see the value that render on the web page, this what I get :

I checked my controller that handle request to show the data from the database :

 @RequestMapping(value = "/attendance", method = RequestMethod.GET)
 public String attendancePage(Model model) 

      model.addAttribute("attendanceIn", new AttendanceCheckIn());
      //Attendance Check In
      model.addAttribute("getAllAttendanceIn", attInServices.getAll());

      return "Attendance";
 }

And, this from table at my web page that using thymeleaf & bootstrap data tables :

<table id="attIn-table" 
       class="table table-bordered" 
       width="100%" 
       cellspacing="0">

     <thead>
        <tr>
           <td>Date & Time</td>
        </tr>
     </thead>
     <tbody>
        <tr th:each="as : ${getAllAttendanceIn}">
           <td th:text="${as.checkIn}"></td>
        </tr>
     </tbody>
 </table>

Can someone told me what happened and how to solve this? Many Thanks

It looks like the timezone where the application is executing is probably UTC-7. Then it converts it to UTC to get the date, which causes the date time to be displayed with +7 hours:

      Date in = Date.from(ldt.toInstant(ZoneOffset.UTC));

Then the date is correct, it is just expressed in UTC because that line is converting explicitly to it.

If it is not what you expect then convert to a Date using the local timezone. It is not clear why you are using java.time classes just to get the current date time if you are not really interested in converting to UTC timezone. A simple Date in=new Date()