Generate border-radius with all corners and general with Sass

border-radius-export.css

.border-radius {
     border-radius: 5px;
}
 .border-radius-small {
     border-radius: 3px;
}
 .border-radius-small-top-left {
     border-radius: 3px;
}
 .border-radius-small-top-right {
     border-radius: 3px;
}
 .border-radius-small-bottom-left {
     border-radius: 3px;
}
 .border-radius-small-bottom-right {
     border-radius: 3px;
}
 .border-radius-medium {
     border-radius: 5px;
}
 .border-radius-medium-top-left {
     border-radius: 5px;
}
 .border-radius-medium-top-right {
     border-radius: 5px;
}
 .border-radius-medium-bottom-left {
     border-radius: 5px;
}
 .border-radius-medium-bottom-right {
     border-radius: 5px;
}
 .border-radius-large {
     border-radius: 10px;
}
 .border-radius-large-top-left {
     border-radius: 10px;
}
 .border-radius-large-top-right {
     border-radius: 10px;
}
 .border-radius-large-bottom-left {
     border-radius: 10px;
}
 .border-radius-large-bottom-right {
     border-radius: 10px;
}

border-radius-generator.scss

// Where the magic happends

$border-list: top-left top-right bottom-left bottom-right;

@mixin border-location($size, $size-unit) {
    &-#{$size} {
        border-radius: $size-unit;
        
        @each $list-item in $border-list {
            &-#{$list-item} {
                border-radius: $size-unit;
            }
        }
    }
}

.border-radius {
    border-radius: 5px; //Default

    @include border-location(small, 3px);
    @include border-location(medium, 5px);
    @include border-location(large, 10px);
}

example.html

<div class="border-radius-small">
  <h1>Hello world</h1>
</div>

how-to-use.md

.border-radius-THESIZE-THELOCATION

THESIZE's: small, medium, large

THELOCATION's: top-left, top-right, bottom-left, bottom-right