are these breakpoint good practice for this website?

$XXS: 390px;
$XS: 576px;
$S: 768px;
$M: 992px;
$L: 1200px;
$XL: 1440px;

@mixin XS {
    @media (max-width: $XS) {
        @content;
    }
}

@mixin S {
    @media (min-width: $XS) and (max-width:$S) {
        @content;
    }
}

@mixin M {
    @media (min-width: $S) and (max-width:$M) {
        @content;
    }
}

@mixin L {
    @media (min-width: $M) and (max-width:$L) {
        @content;
    }
}

@mixin XL {
    @media (min-width: $L) and (max-width:$XL) {
        @content;
    }
}