cssで切手風デザイン

stamp.scss

@mixin stamp($size: 100px, $padding_size: 10px, $color: hsl(0, 0, 50%), $circle_num: 4) {
    padding: $padding_size;
    background: radial-gradient(
      circle closest-side, 
      transparent,  
      transparent 50%,
      $color 50%, 
      $color
    );
  $tile_size: ($size + $padding_size * 2) / $circle_num;
  background-size: $tile_size $tile_size;
  background-position: -1*$tile_size/2  -1*$tile_size/2;
}

.stamp-default{
  $size: 100px;
  $padding_size: 10px;
  $color: gray;
  $circle_num: 4;
  @include stamp($size, $padding_size, $color, $circle_num);
}