<div class="blob"></div>

@use 'sass:math';

$n: 15;
$d: 20%;

.blob {
  width: 100%;
  height: 100%;
  background: linear-gradient(60deg in hsl, #C02942, #ECD078);
  $xc:(); $yc:();
  @for $i from 1 through $n {
    $r: (50% - random($d));
    $xc: append($xc,50% + $r*math.cos(360deg*$i/$n));
    $yc: append($yc,50% + $r*math.sin(360deg*$i/$n));
  }
  $m:();
  $m: append($m,from 
      (nth($xc,1) + nth($xc,$n))/2 
      (nth($yc,1) + nth($yc,$n))/2,comma);
  @for $i from 1 through ($n - 1) {
    $m: append($m, curve
         to (nth($xc,$i) + nth($xc,$i+1))/2
            (nth($yc,$i) + nth($yc,$i+1))/2
         with nth($xc,$i) nth($yc,$i),comma);
  }
  $m: append($m, curve
        to (nth($xc,1) + nth($xc,$n))/2
           (nth($yc,1) + nth($yc,$n))/2
        with nth($xc,$n) nth($yc,$n),comma); 
  clip-path: shape(#{$m})
}

html {
  margin: 0;
  min-height: 100%;
  display: grid;
  place-content: center;
  overflow: auto;
}

body {
  width: 300px;
  height: 300px;
  overflow: hidden;
  border: 2px solid;
  resize: both;
}