The best way of creating a teardrop is to use SVG, which is used to specify vector-based graphics. In our snippet, we show how to create a teardrop using SVG.
On this page, you’ll find information on creating an SVG drop shadow. For that purpose, you can use the SVG <feDropShadow> element or the CSS filter property.
In this tutorial, we want to demonstrate how you can resize SVG image in HTML. For that, you can change the values of the “height” and “width” attributes.