How to add spacing between input elements

Adding gap in .date-of-birth will solve your issue:

<form class="form-container">
    <mat-form-field class="full-width">
        <mat-label>First name *</mat-label>
        <input type="text" name="firstName" matInput placeholder="First name" value="">
    </mat-form-field>

    <mat-form-field class="full-width">
        <mat-label>Last name *</mat-label>
        <input type="text" name="lastName" matInput placeholder="Last name" value="">
    </mat-form-field>

    <div class="date-of-birth">
        <mat-form-field>
            <mat-label>Day</mat-label>
            <input type="number" name="day" matInput placeholder="Day" value="">
        </mat-form-field>

        <mat-form-field>
            <mat-label>Month</mat-label>
            <input type="number" name="month" matInput placeholder="Month" value="">
        </mat-form-field>

        <mat-form-field>
            <mat-label>Year</mat-label>
            <input type="number" name="year" matInput placeholder="Year" value="">
        </mat-form-field>

    </div>

</form>

CSS

.form-container {
  min-width: 150px;
  max-width: 500px;
  width: 100%;
  margin: 0 auto;
}

.full-width {
  width: 100%;
}

.date-of-birth {
  display: flex;
  flex-direction: row;
  gap: 20px;
}

You can use column-gap:

.date-of-birth {
  column-gap: 5px;
  display: flex;
  flex-direction: row;
}

Initially a part of Multi-column Layout, the definition of column-gap has been broadened to include multiple layout methods. Now specified in Box Alignment, it may be used in Multi-column, Flexible Box, and Grid layouts.
https://developer.mozilla.org/en-US/docs/Web/CSS/column-gap

There is already wide support for this, with Safari (both MacOS and iOS) being the unfortunate exception: https://caniuse.com/mdn-css_properties_column-gap_flex_context

If you need support for those exceptions and possibly even Internet Explorer, you can go like this:

.date-of-birth > *:not(:last-child) {
  margin-right: 5px;
}

.date-of-birth {
  display: flex;
  margin: 0 -5px;
}

.date-of-birth mat-form-field {
  max-width: 33.33%;
  flex: 0 0 33.33%;
  padding: 0 5px;
}

I'd suggested this one.