The blob is waiting for you here.
Add the blob-element to your html and you're ready to go.
<blob-element></blob-element>If you want to change the sharpness of the blob you can change the sharpness attribute to a number between 0 and 100. A sharpness of 0 will turn the blob into a circle. The default sharpness is 25.
<blob-element sharpness="30"></blob-element>Remember to give your blob a width, a height and a background of some sort. If you want transitions on your blob you can set the --blob-transition css variable. Have fun!
During the February 2019 week 3 #CodePenChallenge the theme was blob shapes. I found this awesome blob generator and decided to turn it into a reusable web component.
Licensed under MIT.