how to make a responsive html arrow

in my css librarary butterfly css
you can make responsive arrow it uses an img from png tree

example:

 <div   arrow h-100 w-100 rotate=50></div>

preview:

how to make it responsive?
example:

    <div   arrow h-100 w-100 sm-rotate="50" md-rotate="100" lg-rotate="150" xl-rotate="200" dt-rotate="250"></div>

try it and give your feedback

cdn:https://cdn.jsdelivr.net/gh/AMR2010M/butterfly-css@main/attributes.css