JSFiddle - React, Tailwind, and code Playground

by Vince

HTML

<div id="smoke"></div>

CSS

#smoke {
    background: url(http://us.cdn3.123rf.com/168nwm/tuulijumala/tuulijumala1002/tuulijumala100200019/6523893-vector-smoke-puffs-and-rings-isolated-on-white-background.jpg) no-repeat;
    width: 90px;
    height: 165px;
    -webkit-transform-origin: 50% 100%;
    -webkit-animation: mySmoke 3s infinite;
}
@-webkit-keyframes mySmoke {
    0%  {
        -webkit-transform: 
            scale(0.1)
            skewX(5deg)
            translateX(-5px);
    }
    50% {
        -webkit-transform:
            skewX(-5deg)
            translateX(5px);
    }
    100%{
        -webkit-transform:
            scale(1)
            skewX(5deg)
            translateX(-5px);
    } 
}