Highchart xAxis and value did not align

Highchart is doing everything right. Once you remove the formatter from both the XAxis Label and Tooltip, you will see that the Timestamps from your dataset are not actually from 00:00 clock.

I see two ways around this, either convert the x UNIX Timestamp from your dataset to display the date only, or change your Highchart configuration to use the display from your dataset as the XAxis.

The code example below includes the function shiftTimeInData to convert the dataset and to align the x with your display.

I also modified your formatter.

function shiftTimeInData(data){
    $(data).each(function(){
        let d = new Date(this.x);
        this.x = Date.UTC(d.getFullYear(),d.getMonth(),d.getDate()+1);
    });
    return data;
}

$(function () {
    $('#container').highcharts({
       chart: {
            zoomType: 'x',
            type:'area',
            plotBackgroundColor: '#fff',
            backgroundColor:'transparent',
        },
        credits: {
            enabled: false
        },
        title: {
            text: 'X Axis and value not match',
            align: 'left',
            margin: 30,
            style:{
                fontFamily:'VegurRegular',
                fontSize:'21px'
            }
        },
        subtitle: {
            text:'Date Time',
            align: 'left',
            x: 20,
            style: {
                color: '#282828',
                fontFamily:'VegurRegular'
            }
        },
        xAxis: {
            title: {
                text: ''
            },
            formatter: function() {
                  return Highcharts.dateFormat('%Y-%m-%d', this.value);
            },
            type: 'datetime',
            labels : {
                
                style:{
                    fontFamily:'VegurRegular'
                },
                align:'left'
             }
        },
        yAxis: {
            opposite:true,    
            title: {
                text: ''
            },
             
            labels: {
                formatter: function() {
                    return [this.value];
                },
                style:{
                    fontFamily:'VegurRegular'
                }

            },
        },
        tooltip: {
            shared: true,
        },
        legend: {
            enabled: false
        },
        plotOptions: {
            area: {
                fillColor: {
                    linearGradient: [0, 0, 0, 300],
        stops: [
          [0, '#5cc2d6'],
          [1, Highcharts.color('#5cc2d6').setOpacity(0).get('rgba')]
        ]
                },
                lineWidth: 1,
                marker: {
                    enabled: false
                },
                shadow: false,
                states: {
                    hover: {
                        lineWidth: 1
                    }
                },
                threshold: null
            }
        },
        series: [{
            type: 'area',
            name: 'USD to EUR',
            data:  shiftTimeInData([{x: 1628175600000, y: 15.06670830384981064, display: "2021-08-06"},
                  {x: 1628262000000, y: 10.9409600143487062, display: "2021-08-07"},
                  {x: 1628348400000, y: 50.5110465749795092, display: "2021-08-08"},
                  {x: 1628434800000, y: 30.5244073812182639, display: "2021-08-09"},
                  {x: 1628521200000, y: 20.7439211283888343, display: "2021-08-10"},
                  {x: 1628607600000, y: 60.6684340924556529, display: "2021-08-11"},
                  {x: 1628694000000, y: 90.5417027025304146, display: "2021-08-12"}])
        }]
    });
});

As you can see, the function shiftTimeInData is called right when adding the data it to the Highchart series.

You can just use tickPositioner function and generate ticks in the same positions as points.

  tickPositioner: function() {
    return this.series[0].xData;
  }

Live demo: http://jsfiddle.net/BlackLabel/43bugf76/

API Reference: https://api.highcharts.com/highcharts/xAxis.tickPositioner